---

name: frontend-start description: 前端阶段循环入口。AI 自主推导 FE 业务功能清单写入 docs/08 § 三（已有则加载），定位未完成 FE 派发 fe-feature-brainstorm 或 test-gate（前端阶段）。幂等可重入。 user-invocable: false

allowed-tools: Read Write Edit Skill Glob Grep AskUserQuestion Bash(git branch *) Bash(git checkout *) Bash(git rev-parse *) Bash(git status *) Bash(git symbolic-ref *) Bash(git tag *) Bash(find *) Bash(ls *)

所有输出必须使用中文。

frontend-start

执行步骤

步骤 1：检查 prototype

项目根 prototype/ 至少含 1 个 *.html → 通过，进入步骤 2；缺失 → 用 AskUserQuestion 让用户补齐 prototype 后重跑入口，停止。

步骤 2：准备 FE 清单

读 docs/08 § 三 "功能:" 项：

• 已有 - [ ] FE-NN ... 或 - [x] FE-NN ... 行 → 加载：逐行解析得 fe_list[]，每项 { fe_id, name, status, associated_reqs[], associated_prototypes[] }。行格式不符 → 硬停打印问题行

• 仅有 HTML 注释占位（无 FE bullet）→ 推导：

  1. 读 prototype/**/*.html + docs/01-需求清单/**/*.md + docs/05-API接口契约.md
  2. 以业务功能为单位拆分（同流程多屏可合 1 FE；一 HTML 多功能可拆多 FE；无 UI 的 REQ 不产生 FE）。每个 FE：{ fe_id: FE-NN, name, associated_reqs[], associated_prototypes[] }，prototype 路径可带 anchor 区分文件内多区域
  3. 写入 § 三 "功能:" 项（替换占位 HTML 注释），行格式：

   - [ ] FE-NN 功能名 ｜ 关联 REQ：REQ-A, REQ-B ｜ 关联原型：prototype/<file>.html
  

  保留 - 整体里程碑: — 不动；写入后解析得 fe_list[]，继续步骤 3

步骤 3：检查前端里程碑状态

读 § 三 整体里程碑: 字段并 git tag -l 'milestone/frontend-phase' 校验：

• 字段为 milestone/frontend-phase 且 tag 存在 → 打印"前端阶段已完成"并停（冗余保护，正常由 coding-start 拦掉）
• 否则（— 或 tag 不存在）→ 进入步骤 4

步骤 4：切到 frontend-phase 分支

目标分支 frontend-phase，分支管理逻辑同 module-start 步骤 3：已在 → 继续；存在 → checkout；不存在 → 切本地默认分支后 git checkout -b frontend-phase。任何错误硬停 + 诊断，不自动 stash / 覆盖。

步骤 5：识别已完成的 FE

扫 docs/superpowers/reviews/<日期>-FE-*.md，verdict: approve 的收入 done_fes[]。每次进入重新计算，不缓存。

步骤 6：报告进度

按 ${CLAUDE_SKILL_DIR}/templates/frontend-start-banner-template.md 渲染：当前分支 + prototype HTML 数 + FE 进度（done / total）+ 下一 FE。

步骤 7：进入下一环节

• 存在未完成 FE → Skill(fe-feature-brainstorm)，参数 { fe_id, name, associated_reqs[], associated_prototypes[] }
• 全 FE 完成 → Skill(test-gate) 带 phase=frontend

参考

• ${CLAUDE_SKILL_DIR}/templates/frontend-start-banner-template.md
• docs/08-模块任务管理.md § 三（前端阶段元数据：整体里程碑 + FE 清单）
• prototype/（HTML mockup，FE 拆分粒度与文件数无关）
• docs/superpowers/reviews/*-FE-*.md（verdict=approve 即完成）
• 上游：coding-start（步骤 4 派发，仅当后端完成 + 前端未完成）；fe-feature-review approve 后回调
• 下游：fe-feature-brainstorm（每 FE）/ test-gate（phase=frontend，全完成时）
• 前置门禁：本 skill 步骤 1 自承（coding-start 不做）