| name | frontend-implement |
| description | Use when implementing approved docs/vX.Y.Z/plans/*.md tasks with frontend TDD. |
| disable-model-invocation | true |
前端实现
目标
按 plan(TDD 计划)实现,改动不超出已确认方案
输入
| 路径 | 必需 | 说明 |
|---|
docs/technical-architecture.md | 是 | 技术栈、目录、命令、约定 |
docs/vX.Y.Z/plans/*.md | 是 | 任务边界 |
docs/vX.Y.Z/design/*.md | 是 | plan 不清时查 |
docs/vX.Y.Z/prd/summarized/*.md | 是 | 验收、行为边界 |
docs/vX.Y.Z/progress.md | 是 | 步骤/task、TDD 证据、阻塞项 |
| 代码库 | 是 | 跟既有模式 |
缺必需项则停止
输出
- 代码:限 plan 文件边界与任务列文件
- 测试:plan 要求一并提交
- 无额外设计/计划;偏离先回
frontend-design 或 frontend-plan
调用契约与要求
- 调用契约见
frontend-iteration/references/orchestrated-invocation.md
- Agent 沟通风格见
frontend-iteration/references/agent-communication-style.md
- 只执行计划,方案/计划缺口则停止,回上游,不现场改设计
工作流
- 读
docs/technical-architecture.md、目标 plans/*.md;plan ACTIVE,待确认问题已关
- 读
progress.md;定范围:全 plan / 指定 plan·task / resume 首未完成 task
- 风格锚点:
progress.md 无表则从 docs/technical-architecture.md → 代码风格 提炼 5–10 条写入;见 frontend-iteration/references/code-style-enforcement.md
- 当前步骤/task →
in_progress
- 按序 TDD:RED → 风格重载 → GREEN → REFACTOR → VERIFY → 问是否提交 → 过再下一 task
- 每 task 完:RED/GREEN/REFACTOR/VERIFY、commit 状态写
progress.md;问是否提交;确认后 commit;不自动 push
- 全 task 完:完成检查 + 步骤门禁
- 摘要给用户:变更文件、风险、接口 TODO、待步骤 5 项;等确认
规则
- 严守 plan:只改 plan 列文件;plan 外文件须任务明确要求
- 最小改动:能改现有不新建;能局部不重构;不顺手优化扩范围
- TDD:行为变更先失败测试、见正确失败;无 RED 不写生产代码
- 不重新设计:plan/design 不足 → 停;报缺口;回上游;边写边改方案禁止
- 跟现有模式:目录、命名、状态、请求、组件一致;每 task GREEN 前重读风格锚点 + 邻文件
- 测试先行:见
frontend-test → test-writing-guide;RED 失败正确才 GREEN
- 单 task 验证:跑 task「验证」;有 Lint/Typecheck 纳入 VERIFY 记 exit;失败本 task 内修
- 一 task 一提交(可选):VERIFY 过问提交;拒则记未提交;继续前告知变更混合;不 push
- commit:仅英文;Conventional Commits(见下)
- 落盘:TDD 证据写
progress.md;不只聊天
- 接口联调:见
frontend-iteration/references/api-integration-guide.md;封装占位;TODO(vX.Y.Z): 接口联调待定;页面不 fetch、不写死占位
- 状态门禁:见
frontend-iteration/references/orchestrated-invocation.md;上游不可用 → 停
提交说明
- 语言:仅英文
- 格式:
<type>(<scope>): <description> — Conventional Commits
type:feat/fix/refactor/style/test/docs/chore/perf/build/ci
scope:可选,页面/模块名
description:祈使、小写起、无句号;概括 task 目标
- 不跨 task 混提交
feat(user-profile): add avatar upload field
fix(login): handle empty token response
test(user-profile): cover avatar validation rules
单任务执行
读目标与依赖 → 前置 task 已过
↓
RED:最小失败测试;确认失败原因
↓
风格重载:progress.md → 风格锚点 + 邻文件
↓
GREEN:最小实现(API 占位/TODO 见 api-integration-guide)
↓
REFACTOR:必要时清理;测试仍过
↓
VERIFY:task 验证命令(+ lint/typecheck 若配置)
↓
过 → 汇报 → 问提交 → 确认后 commit(可选)
↓
下一 task;失败 → 修或停
常见场景
| 场景 | 处理 |
|---|
| 多 plan | 按依赖顺序;共享文件注意冲突 |
| 从 Task N 续 | 读 progress.md;Task 1…N-1 已过 VERIFY |
| API 与后端不一致 | 封装标 TODO(vX.Y.Z): 接口联调待定 + 占位;阻塞 UI → design |
| 上游 STALE | 停;回对应步骤 |
| 验证命令不存在 | docs/technical-architecture.md 找等价;仍无 → 停 |
| 需 plan 外文件 | 停;回 plan 补 task |
| 用户暂不提交 | 记未提交;告知后续混合 |
| dead code | 不清理,除非 plan 含 |
完成检查
交接下游 → 步骤 5
- 全量测试命令(
docs/technical-architecture.md)
- 每 task RED/GREEN/REFACTOR 摘要
- 未覆盖风险
TODO(vX.Y.Z): 接口联调待定 清单(若有)
文件路径解析
读 skill / reference 时按序尝试(命中即用):
| 资源 | 路径 1(npx skills add) | 路径 2(源码) |
|---|
本子 SKILL.md 目录 | .agents/skills/frontend-implement/ | skills/frontend-implement/ |
| 编排 references | .agents/skills/frontend-iteration/references/<file> | skills/frontend-iteration/references/<file> |
| 其他 references | .agents/skills/<name>/references/<file> | skills/<name>/references/<file> |
| 样例 | .agents/skills/frontend-iteration/examples/ | skills/frontend-iteration/examples/ |