用 AI 编程助手和 Astro 搭建网站

营销网站上的大部分工作并不难，只是很长：做一个看起来和其他页面一样的新页面，把一个区块从一页挪到另一页，写一篇 front matter 正确的博客，改一个谁也记不住的部署设置。AI 编程助手正好擅长这类工作，前提是它们知道这个项目的约定。AstroWind 把这些约定放在两个地方，这样同一个助手既可以创建项目，也可以改成你的品牌，或解释它是怎么工作的，而不用靠猜。

AstroWind 为 AI 编程助手准备了什么

根目录的 AGENTS.md 描述技术栈、目录结构、要运行的命令，以及代码遵循的规则。大多数编程助手会自己读到 AGENTS.md；请看你所用工具的文档（这个仓库里的 CLAUDE.md 只是指向它）。

.agents/skills/ 里每个反复出现的任务对应一个 Markdown 文件，写成操作步骤：改哪些文件、按什么顺序、怎么验证。举几个例子：

……还有十几个，从组件清单到结构化数据、再到带 base path 的部署。AGENTS.md 会让助手在做任何跟项目相关的事之前先找匹配的技能，所以你不用特意提起它们。你自己也可以读：它们很短，当成手册也够用。

对 AI 编程助手效果好的提示

下面这类指令，Claude Code、Cursor 或 GitHub Copilot 这类助手可以从头做到尾，再用 npm run check 和一次构建来确认：

• 「加一个 /careers 页面，包含主视觉、用特性卡片列出的在招职位，以及行动号召，页眉和站点其他页面一致。」
• 「把销售落地页的定价区块改成三档方案的对比表。」
• 「根据这些笔记写一篇博客，封面图用 src/assets/images/ 里的，分类是 Product，标签是 release、changelog。」
• 「把品牌色改成 #0f766e 和 #f59e0b，浅色和深色模式都改，并指出对比度可能有问题的页面。」
• 「关掉博客，并从菜单和页脚里去掉它。」
• 「把这个站点部署到 GitHub Pages 的 /handbook 路径下。」
• 「给定价页加上 FAQ 结构化数据。」
• 「把首页的评价换成一条 logo 条和一句引言。」

每一条都对应一两个技能，再加上组件清单，所以结果往往会和站点其余部分一致，而不是另起一种风格。

让 AI 生成的代码仍然便于审查的习惯

指向一个演示页。 「像产品落地页，但是给一项服务用」会给助手一个可以照抄的具体结构，模板本来就是这么用的。

要求跑检查。 npm run check 会跑 astro check、ESLint 和 Prettier；npm run build 能抓住坏掉的导入和无效的 front matter。让助手在汇报之前把两个都跑一遍，失败时把输出给你看。

看 diff，不看总结。 助手的总结往往说得很满。这些任务的 diff 通常很短，那才是该读的东西。留意写死的颜色（应该用令牌）、指向 # 的链接，以及留下没删的演示内容。

内容决策留给自己。 助手擅长结构和机制；标题、卖点和证据是你的事。真实的评价、真实的数字、真实的截图。

一次对话只做一件事。 先做一页，再写一篇文章，再做部署。长对话会跑偏，短对话能做完。

加上你自己的 AGENTS.md 规则

这些文件就是普通 Markdown，属于你的仓库，所以按你的需要改：

• 给团队反复做的事加一个技能：怎么加案例研究、怎么发版本说明、怎么更新定价表。沿用现有文件的样子：步骤、涉及的文件、验证方式。
• 往 AGENTS.md 里加你自己的规则：命名、语气、哪些页面不能动、分支和审查流程。
• 改了结构性的东西（新的内容集合、不同的部署目标）时，在同一个 pull request 里更新受影响的技能。过时的步骤比没有更糟。

不用 AI 助手也可以

这里没有一样是必须的。这些技能也是模板最短的文档：读一遍组件清单和落地页步骤，大约十分钟，就能覆盖入门指南和定制指南里大部分篇幅讲的内容。