用途:按仓库既有约定创建新的 UI 组件,保证文件布局、TypeScript 用法、样式系统、导出方式和命名一致,是新增 UI 界面的默认入口。
输入:组件名称;目标位置(路由、功能目录或组件库目录);1–2 句职责说明;已知的 props 名称与类型;对现有组件或设计系统的依赖;仓库画像(推荐 <repo>/REPO_PROFILE.json)。
输出:新组件文件;若仓库使用 barrel/index 则补充导出接线;仅当仓库约定要求时才添加最小用法示例(story/demo/test)。
工作流:读取仓库约定(优先 REPO_PROFILE.json,否则从邻近现有组件推断);选择正确放置位置(就近现有模式优先);以最小 API 面创建组件(小 props 面、合理默认值、可预测渲染);按仓库既有方式接线导出,若没有则不做;仅在约定要求时添加最小示例;运行所需校验(若仓库画像中有)。
检查:组件可编译(配置了 typecheck 则通过);组件渲染无运行时错误(冒烟级);导出接线正确(导入路径可用);未修改无关文件。
失败模式:约定不明确时使用 $ask-questions-if-underspecified(框架、文件命名、导出模式);位置错误则按最近现有模式迁移;缺少导出则按仓库模式补充;创建过程中组件过大则拆分子组件并保持公共 API 精简。
遥测记录:skill: frontend/component-scaffold、files_touched、conventions_source: repo_profile | inferred | user_specified、outcome: success | partial | blocked。
非目标:不实现业务/领域规则,不更改 API 契约,不做与新组件无关的大规模重构。