如何让 AI 遵循 TypeScript 与 React 的专业编程标准 #

通过为 AI 注入一套标准化的编码准则（Coding Standards），确保 AI 生成的代码不仅能运行，且符合工业级可读性、可维护性和类型安全要求。

为什么需要这个技能 #

在使用 AI 辅助编程时，AI 往往倾向于提供“能跑通”的最简方案，但这容易导致代码出现以下问题：使用 any 类型、直接修改状态（Mutation）、缺乏错误处理、以及出现深层嵌套的“箭头型”代码。

本技能定义了一套覆盖 TypeScript/JavaScript、React 以及 API 设计的通用标准。将此标准交给 AI，可以让它在编写代码时自动执行 KISS（保持简单）、DRY（不重复）和 YAGNI（不过度设计）原则，从而大幅降低后续的人工 Code Review 成本。

适用场景 #

• 新项目初始化：在项目开始阶段设定统一的变量命名、文件组织和类型定义规范。
• 代码重构：要求 AI 将现有的“面条代码”按照早回模式（Early Return）和函数拆分标准进行优化。
• API 接口开发：确保 REST API 的响应结构一致，并强制执行 Zod 等模式验证。
• 性能优化：在 React 开发中强制 AI 使用 useMemo 和 useCallback 避免不必要的重渲染。

核心工作流 #

1. 原则对齐：要求 AI 优先考虑可读性（Readability First），使用描述性变量名而非简写。
2. 强制不可变性：在处理对象和数组更新时，禁止直接修改，必须使用展开运算符（Spread Operator）。
3. 类型安全约束：禁用 any 类型，强制定义 Interface 或 Type，并为公共 API 编写 JSDoc 格式的文档。
4. 结构化模式应用：
   • React：采用函数式组件 + 强类型 Props，使用自定义 Hook 抽离逻辑。
   • API：遵循 GET/POST/PUT/PATCH/DELETE 标准动作，统一 ApiResponse<T> 响应格式。
   • 测试：遵循 AAA（Arrange-Act-Assert）模式编写测试用例。
5. 消除代码异味：通过检测长函数（>50行）、深层嵌套和魔术数字（Magic Numbers），要求 AI 进行原子化拆分。

下载和安装 #

下载 cc-skill-coding-standards 中文版 Skill ZIP

解压后将目录放入你的 AI 工具 skills 文件夹，重启工具后即可使用。具体路径参考内附的 USAGE.zh.md。

你可能还需要 #

暂无推荐