生成可运行的前端 Demo 代码。支持三种输入：Spec 文档、方案文档、用户直接描述。1 个 Agent 完成分析+生成+验证。
在现有项目中生成可运行的前端 Demo 代码。直接执行，不输出本文档内容。
生成纯前端 Mock Demo：基于 Spec、方案或用户描述，生成完整的前端界面 + Mock 数据，代码可直接运行。
| 模式 | 触发条件 | 数据来源 | 精度 |
|---|---|---|---|
| Mode A: Spec 驱动 | docs/spec/spec.md 存在 | spec.md 结构化 Markdown | 最高 |
| Mode B: Solution 降级 | 无 spec，有 docs/plan/solution.md | 从方案 Markdown 提取 | 中等 |
| Mode C: 对话直接 | 用户描述了具体系统/需求 | 用户对话描述 | 快速原型 |
核心原则：用户意图优先于文件检测。
1. 先判断用户意图：
- 用户描述了具体系统（如「生成CRM系统」「做一个项目管理」）→ 直接 Mode C，不检查文件
- 用户说「基于 spec 生成」「基于方案生成」→ 检查对应文件
- 用户说「生成 demo」「init-app」等泛指 → 按文件优先级检测
2. 仅当泛指时，按文件检测：
a. docs/spec/spec.md 存在 → Mode A
b. 否则 docs/plan/solution.md 存在 → 使用 `AskUserQuestion` 询问用户：
```
AskUserQuestion({
questions: [{
question: "检测到已有解决方案（docs/plan/solution.md），请选择 Demo 生成方式：",
options: [
{ label: "先生成 Spec 再生成 Demo", description: "推荐，精度最高。先运行 /spec-writer，再基于 Spec 生成" },
{ label: "直接基于方案生成 Demo", description: "速度快，但页面结构为推断" }
]
}]
})
```
用户选「先生成 Spec 再生成 Demo」→ 自动执行 /spec-writer 生成 spec.md，完成后继续以 Mode A 执行
用户选「直接基于方案生成 Demo」→ Mode B
c. 否则 → Mode C
禁止反复追问：
始终使用 1 个 Agent，调用 prompts/generate.md 完成分析 → 生成 → 验证。
禁止多 Agent 并行：多个 Agent 操作同一文件系统会导致文件竞争、import 错误和反复 build-fix 循环，实际更慢更贵。
当再次运行时，如果 docs/spec/.spec-mapping.yaml 存在：
locked: true） → 跳过| 类型 | 规范 | 示例 |
|---|---|---|
| 路由文件 | TanStack Router 约定 | src/routes/samples/index.tsx, src/routes/samples/$id.tsx |
| 路由路径 | kebab-case | /samples, /sample-receive |
| 组件文件 | kebab-case | sample-table.tsx |
| 组件名 | PascalCase | SampleTable |
| 函数 | camelCase | getSampleList |
| 常量 | UPPER_SNAKE_CASE | SAMPLE_STATUS |
| 类型 | PascalCase | Sample, SampleStatus |
| 文件 | 用途 | 何时读取 |
|---|---|---|
design-guide.md | 设计系统指南（颜色、排版、布局、组件规则） | 生成代码前 |
_contracts/data-flow.md 第 3 节 | spec.md → init-app 的字段契约 | Mode A 分析阶段 |
.claude/skills/init-app/
├── SKILL.md # 本文件：编排器
├── design-guide.md # 设计系统指南
└── prompts/
└── generate.md # 全合一 Agent Prompt（分析+生成+验证）
| Skill | 关系 |
|---|---|
/spec-writer | 上游，提供 Spec 文档（Mode A） |
/plan-writer | 上游，提供方案文档（Mode B） |
/requirements | 上上游，提供需求数据 |