这个 Skill 能做什么，适合哪些场景？
这是一个面向 Stitch MCP Server 的前端构建技能，采用“接力棒”文件驱动的迭代流程。每次迭代读取当前任务，使用 Stitch 生成页面，将页面整合到网站，并为下一次迭代写入新任务。它要求项目具备 Stitch 项目、设计系统文件和网站规划文件。Chrome DevTools MCP Server 可用于生成页面的视觉验证，但不是必需项。
读取 .stitch/next-prompt.md 获取页面名称和任务；读取 .stitch/SITE.md 与 .stitch/DESIGN.md 获取网站规划和视觉规范；发现 Stitch MCP 工具并创建或读取 Stitch 项目；调用 generate_screen_from_text 生成桌面或指定设备页面；保存项目及屏幕元数据到 .stitch/metadata.json；下载 HTML 和截图到 .stitch/designs/；将 HTML 移动到 site/public/，修复资源路径并更新导航；更新 .stitch/SITE.md；最后写入下一轮的 .stitch/next-prompt.md。
- 前端开发者希望用 Stitch 从一个初始提示开始，逐页构建多页面网站时。
- 需要保持多个生成页面视觉一致，并已有 `.stitch/DESIGN.md` 设计系统时。
- 希望通过 `.stitch/next-prompt.md` 在人工审核、CI/CD 或代理链之间传递下一项网页任务时。
- 需要把 Stitch 生成的静态 HTML 整合到现有 `site/public/` 网站结构时。
- 希望在可用时用 Chrome DevTools MCP Server 对生成页面进行截图核验时。
如何安装这个 Skill？
- 核心功能依赖 Stitch MCP、项目凭据和可能的海外服务；在中国大陆网络或凭据不可用时，需先验证可达性与认证方式。
- SKILL.md 授予 Bash、Write 以及多个 MCP 命名空间权限；执行前应审查实际工具清单、限制写入路径，并为项目创建、下载和站点修改保留可恢复副本。
- “自主”循环会要求每次完成前修改 next-prompt.md，并可能自行选择或发明下一页面；建议在生产仓库中增加人工确认、预算和循环终止条件。
- 未发现所选技能路径的专门测试或真实执行证据；应在采纳前验证元数据持久化、下载 URL 处理、相对路径修复、导航更新和失败反馈。
- Shell / 命令行
- 网络访问
- 本地文件系统
- MCP Server
Stitch MCP Server
将仓库中的 plugins/stitch-utilities 安装为 Stitch Utilities 插件，或按 README 使用：npx skills add google-labs-code/stitch-skills。使用前还需配置并运行 Stitch MCP Server。源材料没有提供该单独技能的独立安装命令或版本要求。
tmp="$(mktemp -d)"
git clone --depth 1 https://github.com/google-labs-code/stitch-skills.git "$tmp"
mkdir -p ~/.claude/skills
cp -R "$tmp/plugins/stitch-utilities/skills/stitch-loop" ~/.claude/skills/
rm -rf "$tmp"根据源仓库地址和 Skill 路径自动生成，只复制这个 Skill 的文件夹。如果上文有作者提供的安装方式，请优先按作者说明操作；想只在当前项目中使用，把 ~/.claude/skills 换成项目里的 .claude/skills。
如何使用这个 Skill？
准备 Stitch 项目、.stitch/DESIGN.md、.stitch/SITE.md 和 .stitch/next-prompt.md，然后触发代理，例如：Build a 5-page portfolio website with Stitch.。技能会按接力棒流程生成页面、整合到 site/public/，并更新下一轮任务。若本地设计文件已存在，重新下载前需要先征得用户确认。
这个 Skill 有哪些优点和局限？
- 流程覆盖任务读取、Stitch 生成、HTML 整合、导航更新和下一轮任务准备。
- 通过 `.stitch/DESIGN.md` 和 `.stitch/SITE.md` 约束视觉一致性与页面路线图。
- 支持保存 Stitch 项目和屏幕元数据，便于后续迭代。
- 可选接入 Chrome DevTools MCP Server 进行视觉核验。
- 必须使用 Stitch MCP Server，并需要本地文件读写和 Shell 能力。
- Chrome 视觉验证是可选的，未配置时不会执行。
- 源材料未提供测试套件、性能基准或跨平台验证结果。
- 技能要求每轮更新接力棒文件，流程依赖明确的项目文件结构。
这个 Skill 与同类方案有什么区别？
与相关 Skills 并排比较；分数均按同一 FSRS 标准得出。
| Skill | FS 评分 | Star 数 | 最近更新 | License |
|---|---|---|---|---|
| Stitch 网站构建循环 本页 | 41 · 不推荐 | ★ 8.5k | 2 个月前 | Apache-2.0 |
| Stitch 设计系统文档生成器 | 45 · 不推荐 | ★ 8.5k | 2 个月前 | Apache-2.0 |
| Stitch 界面生成器 | 45 · 不推荐 | ★ 8.5k | 2 个月前 | Apache-2.0 |
| Stitch 前端设计系统提取器 | 42 · 不推荐 | ★ 8.5k | 2 个月前 | Apache-2.0 |
| Stitch 提示词增强器 | 49 · 谨慎使用 | ★ 8.5k | 2 个月前 | Apache-2.0 |
FollowSkills 如何评估这个 Skill？
明确声明所需工具和 Stitch MCP 依赖，且已有设计文件时要求用户确认是否刷新；但 Bash、Write 及外部 MCP 权限范围较宽，自动创建项目、下载资源、修改站点和持续更新 baton，缺少最小权限、敏感数据处理、回滚和完整数据流披露，因此扣分。
执行协议、文件结构、元数据模式、常见故障和 baton 校验规则较具体；但依赖外部 Stitch 服务，未覆盖项目创建失败、下载失败、无效页面名、权限错误等关键异常，且没有针对该技能的测试或可复现执行证据，因此按静态上限并扣分。
目标用户、迭代场景、输入文件和主要输出较清楚，也说明可选的 Chrome 验证；但非适用边界、语义触发条件、中文支持和中国大陆网络可达性未说明，核心功能依赖 Stitch MCP，适用范围证据有限，因此扣分。
SKILL.md 结构清晰，包含前置条件、流程、示例、资源模板、故障排查和限制提示；仓库提供 Apache-2.0、Security Policy 和 CI，但没有明确维护负责人、技能版本、变更日志或明确更新路径，且 README 的“自动验证”表述超出实际证据，因此扣分。
流程覆盖从读取任务、生成页面、整合站点、导航更新到准备下一 baton，理论上能完成核心迭代并产出可用 HTML；但生成质量、下载结果、链接修复和视觉一致性未经执行验证，且自动循环可能带来额外人工审查成本，因此未接近满分。
源文件、示例和元数据模式可审计，仓库有 CI；但 CI 仅验证另一个 react-components 技能，没有 stitch-loop 的测试、真实运行记录或第三方复核，结论主要来自文档，故分数受静态上限限制。
点击维度查看打分理由
证据充分度：低 — 主要依赖静态检查、作者材料或有限演示；适合发现线索，不适合做高风险决策。
查看完整评分方法 →