SuperAPI AI 工具集

stitch-loop

前端与建站

查看项目

更新于 10-15 22:39

技能介绍

用途:stitch-loop 让智能体以自主循环方式迭代构建网站。每轮迭代读取接力棒文件 next-prompt.md 中的当前任务,用 Stitch 生成页面,集成进站点,再写入下一轮任务,形成持续开发。它不绑定具体触发方式,可由 CI/CD、人工审核、代理链或手动重复运行驱动。

主要能力:

  1. 接力棒系统:next-prompt.md 的 YAML frontmatter 中 page 字段决定输出文件名,正文包含页面提示词。
  2. 通过 Stitch MCP 工具生成页面:先 list_tools 找到 Stitch 的 MCP 前缀;若无 stitch.json 则调用 [prefix]:create_project 创建项目并保存 ID,否则复用其中的 projectId;再调用 [prefix]:generate_screen_from_text(参数含 projectId、prompt、deviceType),最后用 [prefix]:get_screen 取得 htmlCode.downloadUrl 与 screenshot.downloadUrl。
  3. 集成:把生成的 HTML 从 queue/{page}.html 移到 site/public/{page}.html,修正资源路径为相对 public 目录,更新导航并连接占位链接。
  4. 可选视觉校验:若安装了 Chrome DevTools MCP,可用 npx serve site/public 起本地服务,navigate 到 http://localhost:3000/{page}.html,截图与 Stitch 截图比对;未安装则跳过。
  5. 文档维护:更新 SITE.md 的站点地图、路线图与创意区,并在结束前必须更新 next-prompt.md 以维持循环。

使用前提:需要 Stitch MCP Server 访问权限、一个 Stitch 项目、DESIGN.md 设计系统和 SITE.md 站点愿景与路线图;Chrome DevTools MCP 为可选。建议配合 design-md 技能生成 DESIGN.md,并每轮把其设计系统区块复制进提示词以保持视觉一致。

常见问题:忘记更新 next-prompt.md 会中断循环;重建已有页面;提示词缺少设计系统区块;遗留 href="#" 占位链接;忘记持久化 stitch.json。

限制:技能本身不规定编排方式;Web 界面中的大部分具体生成质量依赖 Stitch 与 DESIGN.md,资料未提供具体收费、价格或效果保证。