从零生成一个能跑的页面

请帮我写一个 {{页面/功能描述}}。

技术环境：
- 技术栈：{{如 Next.js + TypeScript + Tailwind}}
- 已有依赖：{{列出你已经装好的包}}
- 文件位置：{{放到哪个目录}}

要求：
1. 产出可以直接运行的完整代码，不要省略、不要写「此处省略」或用注释占位。
2. 不要用我没有的依赖；确实需要新包的话，先告诉我装什么、为什么。
3. 样式用 {{如 Tailwind}}，不要另建 CSS 文件，除非我要求。
4. 关键逻辑加简短中文注释，说明这段在干嘛。
5. 写完后告诉我：怎么运行、访问哪个地址、我该重点看哪几行。

约束：
- 移动端也要能用（至少 {{如 375px}} 宽不能错版）。
- 不要引入我不需要的抽象，能一个文件写完就别拆五个。

把 {{}} 里的部分换成你自己的内容

为什么这么写

1. 把技术栈和已有依赖写死，是避免 AI 凭空引入你没装的最有效手段
2. 「不要省略、不要注释占位」专治 AI 偷懒输出 // ... 其余代码类似
3. 「需要新包先告诉我装什么」把装依赖的决策权留给你，防止版本冲突
4. 要求 AI 告诉你「重点看哪几行」，等于让它自查并给出审阅路径，方便你验收

用起来的样子

「帮我写一个活动落地页，Next.js + Tailwind，放在 app/events/page.tsx，375px 不能错版」——AI 会给出完整 tsx 文件、运行命令和需要关注的响应式断点。

常见坑

• !只说「写个登录页」不给技术栈，AI 给你 React 你项目是 Vue，白给
• !不要求完整代码，AI 常常用省略号交差，你复制下去跑不起来还找不到错在哪

相关分类