name: frontend-scope-lock description: A6 前端范围锁定(Plan 期)——检查项目根 prototype/*.html,从 prototype + docs/01 REQ 卡片 + docs/05/06 提炼项目级 UI 约定、Design Tokens、组件库选型,逐项 AskUserQuestion 确认后写入 docs/06(UI 交互规范)+ docs/04(前端栈),并为每个 FE-NN 锁定设计决策表。把全部前端歧义前移到 Plan 期问清,使 Coding 阶段前端循环无需再弹窗。 user-invocable: false
allowed-tools: Read Write Edit Glob Grep Skill AskUserQuestion
所有输出必须使用中文。
frontend-scope-lock
执行步骤
关于 AskUserQuestion:下文只描述「问什么、给哪些选项、各选项导向什么后续」。
header/ 各选项的description/multiSelect等具体参数由你按工具 schema 自行填全合法值——不要把下文的选项文字当成完整调用照抄。
步骤 1:检查 prototype(缺失则在此问)
用 Glob 检查项目根 prototype/**/*.html:
-
至少 1 个
.html→ 通过,记下文件清单,进入步骤 2。 -
0 个 → 这是 Plan 期,可以问。用
AskUserQuestion告知用户「未在 prototype/ 找到任何 .html 原型,前端范围锁定依赖原型作为页面骨架权威」,给「我已补齐原型,请重新检查」和「本项目无前端,跳过 A6」两个选项。- 选「已补齐」→ 重新
Glob:命中则进入步骤 2,仍为 0 则重复本问。 - 选「无前端」→ 在 docs/08 § 一 同时勾父项 + 3 子项(否则下次 plan-start 会重派),父项行尾注「(无前端,A6 跳过)」,打印步骤 6 横幅(产出标注「跳过」)并停止,不写 docs/06 / docs/04。3 子项:
- [x] docs/06 项目级 UI 约定 + Design Tokens + 组件库已锁定(无前端跳过)- [x] docs/04 § 二 前端栈已锁定(引用 docs/06)(无前端跳过)- [x] 各 FE-NN 设计决策表已生成(docs/06 § 三之后 / docs/08 § 三)(无前端跳过)
- 选「已补齐」→ 重新
步骤 2:收集证据(只读,不问)
为提炼项目级约定,Read 以下来源:
-
prototype/:所有
*.html,作为页面布局 / 组件 / 交互的实测权威(DOM 结构、表单展现、列表范式、状态色实例)。 -
docs/01-需求清单/:各
_module.md+REQ-*.md,提取 UI 描述、业务校验、acceptance 中与界面相关的部分。 - docs/05-API接口契约.md:端点列表,确认前端要消费的接口集合(影响页面状态机 / 加载态)。
-
docs/06-UI交互规范.md:已有的通用交互规则(§ 一)、Design Tokens(§ 二)、页面清单(§ 三 由 A5 填)。布局以项目根
prototype/为权威,docs/06 不设独立布局小节。本 skill 在此基础上收敛 / 补全,不推翻已确认内容。 -
docs/04-技术规范.md § 零:技术栈表里的前端行(如
前端 UI 组件= Ant Design),作为组件库选型默认值来源。
把证据归纳为三组草案:(a) 项目级 UI 约定、(b) Design Tokens(全局调色板 + 组件级状态色)、(c) 组件库选型。草案优先复用 docs/06 / docs/04 既有值(已锁定的不重问),仅对 prototype 与现文档不一致或缺失的点进入步骤 3 确认。
步骤 3:逐项 AskUserQuestion 确认
一次一问,仅对真歧义点。每问给出「从证据提炼的默认值」让用户确认 / 覆盖,不造无意义确认题。建议覆盖(无歧义的项直接采用默认值,不弹问):
- UI 约定:整体布局骨架、最小视口 / 响应式策略、列表页范式、表单展现阈值(Modal / Drawer / 独立页)、操作反馈范式、数据展示约定、前端权限控制方式。
- Design Tokens:全局调色板语义→变量→默认值;组件级状态色表(编辑 / 只读 / 悬浮 的 bg/fg)。prototype 中出现但未登记的色值 → 问是否新增 token。
- 组件库选型:UI 组件库 + 版本(默认取 docs/04 § 零)、主题接入方式、图标库、表格 / 表单是否二次封装。
每个确认结果即时记入对应草案。绝不留 【人工填写:】 / {{占位}} / TBD 作为最终值。
步骤 4:写入 docs/06 + docs/04
用 ${CLAUDE_SKILL_DIR}/templates/fe-scope-template.md 作为填充骨架,把步骤 3 确认后的真实值填入(剥掉模板内 HTML 注释),分别落盘:
-
docs/06-UI交互规范.md(用
Edit合并,不另起文件;小节编号以skeleton-gen/templates/docs-06-static-template.md为权威:§ 一 通用交互规则 / § 二 Design Tokens / § 三 页面清单):- 模板 § 一 → 收敛 / 补全 docs/06 § 一(通用交互规则)的项目级约定。
- 模板 § 二 → 写入 / 校正 docs/06 § 二(Design Tokens 全局调色板 + 组件级状态色 + Token 默认值),与
src/styles/tokens.css命名规范(docs/04 § 2.5)一致。 - 模板 § 五 → 追加到 docs/06 § 三(页面清单)之后,作为 FE 级设计决策表:FE 清单来自 docs/08 § 三(若 § 三 尚无 FE bullet,则在此按 prototype + docs/01 + docs/05 推导 FE 清单并同时写入 docs/08 § 三「功能:」项,行格式见 docs/08 模板)。一 FE 一行。
-
docs/04-技术规范.md § 二(前端编码规范)(用
Edit):- 把组件库选型 + 模板 § 四前端栈摘要写入 / 校正 § 2.3(组件 / 页面编写规范)与 § 2.5(样式与主题)的引用说明;色值约定指向 docs/06 § 二。
- 不重复抄 docs/06 全文,只写「前端组件库 = X、tokens 锁定于 docs/06 § 二」这类引用,保持 SSoT。
写入时遵循模板的字面安全约定:值含 $ / { / } 等字符原样写入,不做二次解释。
步骤 5:自审(inline 修,不等用户)
- 模板五节均已填充,无
{{...}}/【人工填写:】/TBD残留(Grep校验 docs/06 + docs/04 本次写入区域)。 - 组件库选型与 docs/04 § 零前端行一致;如确认值覆盖了 § 零默认值,回写 § 零保持一致。
- docs/06 § 五 / docs/08 § 三 的 FE-NN 集合一致,每个 FE 行字段非空。
- 命中残留 → 就地修正后重新校验;无法自决的歧义 → 回步骤 3 补问。
步骤 6:勾选 docs/08 + 终止横幅
- 用
Edit在docs/08-模块任务管理.md § 一勾选 A6 子项 + 父项:- [ ] docs/06 项目级 UI 约定 + Design Tokens + 组件库已锁定- [ ] docs/04 § 二 前端栈已锁定(引用 docs/06)- [ ] 各 FE-NN 设计决策表已生成(docs/06 § 三之后 / docs/08 § 三)- [ ] A6 前端范围锁定 — frontend-scope-lock
- 向用户直接输出终止横幅并停止:
[frontend-scope-lock] ✅ A6 前端范围锁定完成
产出:docs/06 § 一/二 + § 三之后各 FE-NN 决策表;docs/04 § 二 前端栈(引用 docs/06)。
Plan 阶段(A0~A6)到此结束。请运行 /erp-workflow:plan-start 进入终结闸。
参考
-
${CLAUDE_SKILL_DIR}/templates/fe-scope-template.md(产出骨架) -
prototype/**/*.html(页面骨架实测权威,步骤 1 前置门由本 skill 自承) -
docs/01-需求清单/**/*.md(UI 描述 / 业务校验来源) -
docs/05-API接口契约.md(前端消费端点) -
docs/06-UI交互规范.md(写入目标:§ 一 通用交互约定、§ 二 Tokens、§ 三之后 FE 决策表) -
docs/04-技术规范.md § 二 / § 零(前端栈 + 组件库选型写入目标) -
docs/08-模块任务管理.md § 一(A6 进度勾选)/§ 三(FE 清单) - 上游:
plan-start(A5 完成后派发到此) - 下游:
plan-start终结闸(A6 完成后回交校验);Coding 阶段workflows/coding.mjs前端循环消费本 skill 的产出