stitch-skills stitch-loop完全指南一个提示词构建多页网站【免费下载链接】stitch-skillsA library of Agent Skills designed to work with the Stitch MCP server. Each skill follows the Agent Skills open standard, for compatibility with coding agents such as Antigravity, Gemini CLI, Claude Code, Cursor.项目地址: https://gitcode.com/GitHub_Trending/st/stitch-skillsstitch-skills 是一套专为 Google Stitch 打造的开源 Agent Skills 技能库其中的stitch-loop技能可以教会 AI 编程助手接力式地自主构建网站——你只需给出一个初始提示词Agent 就会循环生成页面、整合进站点结构并自动写好下一轮的构建任务最终交付一个完整的多页网站。它兼容 Claude Code、Cursor、Gemini CLI、Antigravity 等主流 AI 编码工具。什么是 stitch-loop让 AI 自主建站的接力棒机制传统做法是一句话生成一个页面但多页网站需要几十次提示词。stitch-loop 的核心创新是接力棒Baton机制Agent 每完成一轮迭代会把下一个要做什么写进接力棒文件下一轮 Agent 读取接力棒继续干活形成自驱动的闭环。每一轮迭代固定执行四件事从接力棒文件.stitch/next-prompt.md读取当前任务调用 Stitch MCP 工具生成页面把页面整合进网站结构导航、页头页脚、资源路径写下下一轮任务把接力棒传下去安装配置三步启用 stitch-loop前提条件已配置好 Stitch MCP 服务器需在 Stitch 官方完成注册和环境变量配置并在你的 AI Agent 中启用工具调用能力。第 1 步一键安装技能npx skills add google-labs-code/stitch-skills --skill stitch-loop --global第 2 步可选克隆仓库查看文档如果想阅读完整的技能定义和示例文件可克隆仓库到本地git clone https://gitcode.com/GitHub_Trending/st/stitch-skills第 3 步让 Agent 读取技能入口文件安装后核心指令位于 SKILL.md同目录下的 README.md 提供了快速上手说明。对 Agent 说读取 stitch-loop 技能并开始构建即可激活。核心三件套网站构建前必须准备的三个文件stitch-loop 依赖.stitch/目录下的长期记忆文件相当于网站项目的宪法文件作用来源SITE.md站点愿景、站点地图、任务路线图由 site-md 技能 生成DESIGN.md设计系统配色、字体、组件风格由 design-md 技能 分析现有屏幕后生成next-prompt.md接力棒记录当前要构建的页面首轮由你或 enhance-prompt 技能 编写仓库自带了一份可直接参考的家具网站示例 SITE.md包含 7 个标准章节核心身份、视觉语言、文件架构、站点地图、路线图、创意自由区和参与规则。配套的接力棒格式规范见 baton-schema.md站点模板见 site-template.md。单轮迭代详解从读取接力棒到传递接力棒的 6 步流程以示例接力棒 next-prompt.md 为例任务是构建一个联系方式页面Agent 每轮自动执行Step 1 读取接力棒解析 YAML 头部的page字段确定输出文件名如contact读取正文作为生成提示词。Step 2 查阅上下文读取SITE.md的站点地图绝不重复构建已存在的页面若路线图Roadmap有积压任务则从中取否则从创意自由区Creative Freedom挑选或自创新页面。Step 3 调用 Stitch 生成屏幕获取或创建 Stitch 项目用完整提示词必须包含设计系统块生成页面并将 HTML 和截图下载到暂存目录.stitch/designs/。所有项目 ID 会持久化到.stitch/metadata.json供后续迭代复用。Step 4 整合进网站把生成的 HTML 移入site/public/修正相对路径把占位链接href#接线到真实页面统一全站导航。Step 5 更新站点文档在SITE.md的站点地图中把新页面标记为[x]并从创意区移除已使用的想法。Step 6 写下下一根接力棒关键一步决定下一个页面按规范格式写入next-prompt.md。如果跳过这一步循环就会中断。⚠️可选加分项如果配置了 Chrome DevTools MCP 服务器Agent 还会启动本地服务器、渲染页面并截图与 Stitch 设计稿做视觉比对确保还原度。四种编排方式让循环持续运转stitch-loop 与触发机制完全解耦你可以选择任意驱动方式方式玩法CI/CD监听next-prompt.md变化自动触发新迭代人工把关开发者审核每一轮产出后再继续Agent 链一个 Agent 完成后派发给另一个 Agent手动开发者反复对同一仓库运行 Agent对新手最友好的是人工把关模式每轮跑完检查一下页面满意了再让 Agent 继续传棒。避坑清单循环卡住的 5 个常见原因问题解决方案循环中断检查next-prompt.md是否已更新且 frontmatter 合法页面重复构建先核对SITE.md站点地图已存在则跳过页面风格不一致提示词中必须完整携带DESIGN.md的设计系统块导航死链所有内部链接使用正确的相对路径不留#占位项目丢失创建 Stitch 项目后立即持久化metadata.json配套技能扩展从能跑到高品味stitch-loop 属于 stitch-utilities 插件 的一部分配合以下技能体验更佳design-md分析 Stitch 项目自动合成语义化DESIGN.md设计系统文件SKILL.mdtaste-design生成反 AI 平庸感的高级感设计系统内置禁用纯黑、禁用霓虹渐变等规则SKILL.mdenhance-prompt把做个设置页这类模糊想法改写成结构化的 Stitch 优化提示词SKILL.md总结一个提示词开启多页网站之旅stitch-loop 的价值在于把重复劳动交给了流程你负责定愿景SITE.md和定风格DESIGN.mdAgent 负责一轮轮地生成、整合、传棒。按照本指南完成安装和文件准备后只要对 Agent 说一句读取 next-prompt.md用 Stitch 生成页面然后准备下一轮迭代。一个多页网站就会在你的接力棒机制中一页一页地自动生长出来。【免费下载链接】stitch-skillsA library of Agent Skills designed to work with the Stitch MCP server. Each skill follows the Agent Skills open standard, for compatibility with coding agents such as Antigravity, Gemini CLI, Claude Code, Cursor.项目地址: https://gitcode.com/GitHub_Trending/st/stitch-skills创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 stitch-skills stitch-loop完全指南：一个提示词构建多页网站
stitch-skills stitch-loop完全指南一个提示词构建多页网站【免费下载链接】stitch-skillsA library of Agent Skills designed to work with the Stitch MCP server. Each skill follows the Agent Skills open standard, for compatibility with coding agents such as Antigravity, Gemini CLI, Claude Code, Cursor.项目地址: https://gitcode.com/GitHub_Trending/st/stitch-skillsstitch-skills 是一套专为 Google Stitch 打造的开源 Agent Skills 技能库其中的stitch-loop技能可以教会 AI 编程助手接力式地自主构建网站——你只需给出一个初始提示词Agent 就会循环生成页面、整合进站点结构并自动写好下一轮的构建任务最终交付一个完整的多页网站。它兼容 Claude Code、Cursor、Gemini CLI、Antigravity 等主流 AI 编码工具。什么是 stitch-loop让 AI 自主建站的接力棒机制传统做法是一句话生成一个页面但多页网站需要几十次提示词。stitch-loop 的核心创新是接力棒Baton机制Agent 每完成一轮迭代会把下一个要做什么写进接力棒文件下一轮 Agent 读取接力棒继续干活形成自驱动的闭环。每一轮迭代固定执行四件事从接力棒文件.stitch/next-prompt.md读取当前任务调用 Stitch MCP 工具生成页面把页面整合进网站结构导航、页头页脚、资源路径写下下一轮任务把接力棒传下去安装配置三步启用 stitch-loop前提条件已配置好 Stitch MCP 服务器需在 Stitch 官方完成注册和环境变量配置并在你的 AI Agent 中启用工具调用能力。第 1 步一键安装技能npx skills add google-labs-code/stitch-skills --skill stitch-loop --global第 2 步可选克隆仓库查看文档如果想阅读完整的技能定义和示例文件可克隆仓库到本地git clone https://gitcode.com/GitHub_Trending/st/stitch-skills第 3 步让 Agent 读取技能入口文件安装后核心指令位于 SKILL.md同目录下的 README.md 提供了快速上手说明。对 Agent 说读取 stitch-loop 技能并开始构建即可激活。核心三件套网站构建前必须准备的三个文件stitch-loop 依赖.stitch/目录下的长期记忆文件相当于网站项目的宪法文件作用来源SITE.md站点愿景、站点地图、任务路线图由 site-md 技能 生成DESIGN.md设计系统配色、字体、组件风格由 design-md 技能 分析现有屏幕后生成next-prompt.md接力棒记录当前要构建的页面首轮由你或 enhance-prompt 技能 编写仓库自带了一份可直接参考的家具网站示例 SITE.md包含 7 个标准章节核心身份、视觉语言、文件架构、站点地图、路线图、创意自由区和参与规则。配套的接力棒格式规范见 baton-schema.md站点模板见 site-template.md。单轮迭代详解从读取接力棒到传递接力棒的 6 步流程以示例接力棒 next-prompt.md 为例任务是构建一个联系方式页面Agent 每轮自动执行Step 1 读取接力棒解析 YAML 头部的page字段确定输出文件名如contact读取正文作为生成提示词。Step 2 查阅上下文读取SITE.md的站点地图绝不重复构建已存在的页面若路线图Roadmap有积压任务则从中取否则从创意自由区Creative Freedom挑选或自创新页面。Step 3 调用 Stitch 生成屏幕获取或创建 Stitch 项目用完整提示词必须包含设计系统块生成页面并将 HTML 和截图下载到暂存目录.stitch/designs/。所有项目 ID 会持久化到.stitch/metadata.json供后续迭代复用。Step 4 整合进网站把生成的 HTML 移入site/public/修正相对路径把占位链接href#接线到真实页面统一全站导航。Step 5 更新站点文档在SITE.md的站点地图中把新页面标记为[x]并从创意区移除已使用的想法。Step 6 写下下一根接力棒关键一步决定下一个页面按规范格式写入next-prompt.md。如果跳过这一步循环就会中断。⚠️可选加分项如果配置了 Chrome DevTools MCP 服务器Agent 还会启动本地服务器、渲染页面并截图与 Stitch 设计稿做视觉比对确保还原度。四种编排方式让循环持续运转stitch-loop 与触发机制完全解耦你可以选择任意驱动方式方式玩法CI/CD监听next-prompt.md变化自动触发新迭代人工把关开发者审核每一轮产出后再继续Agent 链一个 Agent 完成后派发给另一个 Agent手动开发者反复对同一仓库运行 Agent对新手最友好的是人工把关模式每轮跑完检查一下页面满意了再让 Agent 继续传棒。避坑清单循环卡住的 5 个常见原因问题解决方案循环中断检查next-prompt.md是否已更新且 frontmatter 合法页面重复构建先核对SITE.md站点地图已存在则跳过页面风格不一致提示词中必须完整携带DESIGN.md的设计系统块导航死链所有内部链接使用正确的相对路径不留#占位项目丢失创建 Stitch 项目后立即持久化metadata.json配套技能扩展从能跑到高品味stitch-loop 属于 stitch-utilities 插件 的一部分配合以下技能体验更佳design-md分析 Stitch 项目自动合成语义化DESIGN.md设计系统文件SKILL.mdtaste-design生成反 AI 平庸感的高级感设计系统内置禁用纯黑、禁用霓虹渐变等规则SKILL.mdenhance-prompt把做个设置页这类模糊想法改写成结构化的 Stitch 优化提示词SKILL.md总结一个提示词开启多页网站之旅stitch-loop 的价值在于把重复劳动交给了流程你负责定愿景SITE.md和定风格DESIGN.mdAgent 负责一轮轮地生成、整合、传棒。按照本指南完成安装和文件准备后只要对 Agent 说一句读取 next-prompt.md用 Stitch 生成页面然后准备下一轮迭代。一个多页网站就会在你的接力棒机制中一页一页地自动生长出来。【免费下载链接】stitch-skillsA library of Agent Skills designed to work with the Stitch MCP server. Each skill follows the Agent Skills open standard, for compatibility with coding agents such as Antigravity, Gemini CLI, Claude Code, Cursor.项目地址: https://gitcode.com/GitHub_Trending/st/stitch-skills创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考