用途:在 Web 应用中编辑任何 React/TSX 代码时使用,包括创建或修改组件、页面、页头页脚及布局。
主要能力:先判断请求属于三类之一——页面(新增路由页面,如联系人页、仪表盘页、设置区)、页头/页脚(全站导航栏或页脚)、组件(页面内的卡片、表格、表单、对话框等 UI 元素)。若类型不明确,需询问用户是新增页面、全站页头页脚,还是现有页面内的组件。
使用方式:澄清问题一次只问一个,得到回答后再问下一个,信息足够即停止,不猜测。页面类需确认名称与用途、URL 路径、是否出现在导航菜单、访问权限(公开、仅登录用户 PrivateRoute、仅未登录如登录页 AuthenticationRoute)、包含内容与区块、是否需要取数及来源。页头/页脚类需确认是页头、页脚还是两者、各自内容(logo/应用名、导航链接、用户头像、CTA 按钮、版权文字、社交图标等)、页头是否吸顶、品牌名或占位、配色风格、导航链接对应页面。组件类需确认功能、出现位置、是否跨页复用(决定文件位置)、所需数据或 props、是否需要内部状态、是否使用特定 shadcn 组件、布局位置。
确定类型并收集答案后,按对应实现指南执行:页面读 implementation/page.md,页头/页脚读 implementation/header-footer.md,组件读 implementation/component.md。
TypeScript 规范:禁止使用 any,改用正确类型、泛型或 unknown 配合类型守卫;事件处理函数写作 (event: React.FormEvent<HTMLFormElement>): void;状态需带类型参数,如 useState<User | null>(null);禁止不安全断言(obj as User),改用类型守卫,例如 function isUser(obj: unknown): obj is User { return typeof obj === 'object' && obj !== null && typeof (obj as User).id === 'string'; }。
验证(强制):完成前在 Web 应用目录 force-app/main/default/webapplications/<appName>/ 下运行 cd force-app/main/default/webapplications/<appName> && npm run lint && npm run build。Lint 必须 0 错误,Build 必须成功(含 TypeScript 检查);任一失败需修复并重跑,不得留下未通过的质量门禁。
限制:资料未提供具体框架版本、依赖安装方式、示例代码细节及适用平台范围,暂未提供。