Cursor 使用技巧:编写规范可用的代码

本文档聚焦于如何使用 Cursor AI 编辑器编写规范、可用、高质量的代码。涵盖从项目配置到代码生成、审查、优化的完整工作流。


📚 目录


核心技能清单 (Cursor Skills)

要在 Cursor 中达到“人机合一”的状态,你需要熟练掌握以下核心技能:

1. 上下文控制技能 (@ 符号)

学会告诉 AI “看哪里”是最高级的技能。

  • @Files:精准引用文件。不要让 AI 猜,直接指定文件。
  • @Codebase:全局搜索。当你不知道某个功能在哪实现时,用它。
  • @Web:联网搜索。查最新的 API 文档、报错解决方案。
  • @Docs:引入外部官方文档(如 Umi, React)。
  • @Git:对比差异、编写 Commit Message。
  • @Definitions:只引用定义,节省 Token 且精准。

2. 意图表达技能 (Prompting)

  • Composer (Cmd+I):全案生成技能。适合从 0 到 1 创建功能、跨文件重构。
  • Chat (Cmd+L):咨询与调优技能。适合问“为什么”、讨论方案、解释代码。
  • Inline Edit (Cmd+K):局部手术技能。选中一段代码,精准修改(如“把这个循环改写成 map”)。
  • Tab (Copilot++):预判技能。顺着 AI 的思路写代码,快速补全逻辑。

3. 规则约束技能 (.cursorrules)

  • 项目级约束:在根目录创建 .cursorrules,强制 AI 遵守你的代码风格(如:强制使用 Umi Model、强制 TS 严谨模式)。
  • Notepads:临时规则。将一段反复使用的复杂需求存为 Notepad,随调随用。

4. 调试与验证技能

  • Terminal 联动:在 Chat 中直接输入“运行项目”或“运行测试”,让 AI 帮你排查报错。
  • 代码对比 (Diff):养成习惯,在接受 AI 的修改前,仔细阅读 Diff 视图。

5. 激发 AI 高级技能 (MCP & Workflow)

  • Auto Verification:完成代码后要求 AI “进入验证阶段”,AI 会结合终端报错和浏览器工具进行自检。

6. 前瞻技能:Agent Skills (SKILL.md)

这是 Cursor 官方定义的模块化能力方案(目前主要在 Nightly 版本中通过设置开启)。

1. 技能包目录结构

一个标准的 Agent Skill 是以目录形式存在的:

skill-name/
├── SKILL.md          # 必需:主定义文件(Markdown 格式)
├── scripts/          # 可选:该技能依赖的可执行脚本 (Python/Bash/JS)
├── references/       # 可选:参考文档或 API 规范
└── assets/           # 可选:静态资源、模板文件

2. SKILL.md 文件规范

文件顶部必须包含 YAML 格式的元数据(Metadata):

---
name: umi-expert
description: 专门处理 Umi 项目的重构、Model 转换及插件配置的专家技能。
---
 
# Umi Expert Skill
 
## 触发场景 (Context)
- 当用户提到 "将状态提取到全局" 时。
- 当检测到项目根目录存在 .umirc.ts 或 config/config.ts 时。
 
## 执行指令 (Instructions)
1. 优先检查 `src/models` 是否存在。
2. 自动生成符合复数命名的 Model 文件。
3. 使用 @umijs/max 的 useModel 语法进行替换。
 
## 示例 (Examples)
- 用户输入:"帮我把这个 useState 变成全局 model"
- AI 响应:[启动 umi-expert 技能] -> 执行重构...

3. 与 .cursorrules 的核心区别

  • 动态感知:Agent 会根据 description 描述自主判断何时加载该技能,而不是像 Rules 那样每一句对话都强行包含。
  • 模块化复用:你可以将 skill-name 文件夹直接拷贝到其他项目中使用。

项目配置与规范

1. .cursorrules 文件配置

.cursorrules 是 Cursor 的核心配置文件,用于定义项目的编码规范和 AI 行为规则。

基础配置示例

在项目根目录创建 .cursorrules 文件:

# 项目编码规范
 
## 代码风格
- 使用 TypeScript 严格模式
- 遵循 ESLint 和 Prettier 配置
- 使用 2 空格缩进
- 使用单引号
- 行尾不使用分号(根据项目配置)
 
## 命名规范
- 变量和函数使用 camelCase
- 组件使用 PascalCase
- 常量使用 UPPER_SNAKE_CASE
- 文件名使用 kebab-case
 
## 代码质量要求
- 所有函数必须有 JSDoc 注释
- 复杂逻辑必须添加注释说明
- 避免使用 any 类型
- 优先使用函数式编程风格
- 保持函数单一职责原则
 
## 测试要求
- 所有公共函数必须有单元测试
- 测试覆盖率不低于 80%
- 使用描述性的测试用例名称
 
## 错误处理
- 使用 try-catch 处理异步错误
- 提供有意义的错误信息
- 记录错误日志
 
## 性能要求
- 避免不必要的重渲染
- 使用 React.memo 优化组件
- 合理使用 useMemo 和 useCallback

高级配置示例

# React + TypeScript 项目规范
 
## 技术栈
- React 18+
- TypeScript 5+
- Vite
- ESLint + Prettier
 
## 组件规范
- 使用函数组件和 Hooks
- Props 必须定义 TypeScript 接口
- 组件必须支持 forwardRef(如需要)
- 使用 React.memo 优化性能
 
## 状态管理
- 优先使用 useState 和 useReducer
- 复杂状态使用 Context API
- 全局状态使用 Zustand 或 Redux Toolkit
 
## 代码生成要求
- 生成的代码必须通过 ESLint 检查
- 必须包含 TypeScript 类型定义
- 必须包含错误处理
- 必须包含基本的单元测试
 
## 文件组织
- 每个组件一个文件
- 相关工具函数放在 utils 目录
- 类型定义放在 types 目录
- 常量放在 constants 目录

2. 项目上下文配置

代码库索引

Cursor 会自动索引项目代码,但可以通过以下方式优化:

  1. 明确项目结构:保持清晰的目录结构
  2. 使用有意义的文件名:便于 AI 理解文件用途
  3. 添加 README:在关键目录添加 README 说明

引用项目文件

在 Chat 中使用 @文件名 引用特定文件:

@src/components/Button.tsx 请帮我优化这个组件

使用 @codebase 引用整个代码库:

@codebase 这个项目使用的是什么状态管理方案?

3. 编辑器配置

推荐设置

在 Cursor 设置中配置:

{
  "editor.formatOnSave": true,
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": "explicit",
    "source.organizeImports": "explicit"
  },
  "cursor.chat.model": "claude-3.5-sonnet",
  "cursor.tabCompletion.enabled": true,
  "cursor.tabCompletion.delay": 300
}

4. 定义多个 Agent(自定义模式)

Cursor 支持通过**自定义模式(Custom Modes)**来定义多个专门的 Agent,每个 Agent 可以针对不同的任务进行优化配置。

什么是自定义模式

自定义模式允许你为不同的开发场景创建专门的 AI Agent,每个模式可以:

  • 配置特定的工具组合
  • 设置专门的行为指令
  • 优化特定任务的响应方式

创建自定义模式的步骤

1. 启用自定义模式功能

  • 打开 Cursor 设置(Cmd/Ctrl + ,
  • 导航至 “Chat”“Agent” 部分
  • 找到 “Custom Modes” 选项并启用

2. 创建新的自定义模式

  • 在设置中点击 “New Custom Mode”“Create Mode”
  • 为新模式命名,例如:
    • Debug Assistant - 调试助手
    • Refactor Helper - 重构助手
    • Test Generator - 测试生成器
    • Code Reviewer - 代码审查员
    • Documentation Writer - 文档编写器

3. 配置模式的工具(Tools)

根据需求启用或禁用特定工具:

  • Codebase - 代码库搜索
  • Terminal - 终端命令执行
  • Edit & Reapply - 编辑和重新应用
  • Web Search - 网络搜索
  • File Operations - 文件操作
  • Git Operations - Git 操作

4. 设置指令(Instructions)

定义该模式下 Agent 的行为和响应方式:

# 调试助手模式指令示例
 
你是一个专业的调试助手。你的工作流程是:
 
1. **问题分析**:首先充分理解错误信息和代码上下文
2. **根因分析**:深入分析问题的根本原因,不要急于给出解决方案
3. **方案验证**:提出修复方案前,先验证方案的可行性
4. **详细说明**:解释为什么会出现这个问题,以及如何避免类似问题
 
工作原则:
- 优先查看错误日志和堆栈跟踪
- 检查相关的配置文件和依赖
- 提供可复现的测试步骤
- 给出预防措施建议

常用 Agent 模式示例

1. 调试助手(Debug Assistant)

工具配置

  • ✅ Codebase(代码库搜索)
  • ✅ Terminal(终端)
  • ✅ Edit & Reapply(编辑)
  • ✅ Web Search(网络搜索)

指令示例

你是一个专业的调试助手。在提出修复方案前,请:
1. 仔细分析错误信息和堆栈跟踪
2. 检查相关配置和依赖
3. 提供可复现的测试步骤
4. 解释问题的根本原因
5. 给出预防措施建议
2. 重构助手(Refactor Helper)

工具配置

  • ✅ Codebase(代码库搜索)
  • ✅ Edit & Reapply(编辑)
  • ✅ File Operations(文件操作)

指令示例

你是一个代码重构专家。重构时请遵循:
1. 保持功能不变
2. 提高代码可读性
3. 遵循 SOLID 原则
4. 保持测试通过
5. 提供重构前后的对比说明
3. 测试生成器(Test Generator)

工具配置

  • ✅ Codebase(代码库搜索)
  • ✅ Edit & Reapply(编辑)
  • ✅ File Operations(文件操作)

指令示例

你是一个测试编写专家。生成的测试应该:
1. 覆盖正常情况、边界情况和错误情况
2. 使用描述性的测试用例名称
3. 遵循 AAA 模式(Arrange-Act-Assert)
4. 测试覆盖率不低于 80%
5. 包含必要的 mock 和 setup
4. 代码审查员(Code Reviewer)

工具配置

  • ✅ Codebase(代码库搜索)
  • ✅ Web Search(网络搜索)

指令示例

你是一个严格的代码审查员。审查时请检查:
1. 代码质量和可读性
2. 性能问题
3. 安全性问题
4. 类型安全
5. 错误处理
6. 测试覆盖
7. 代码规范
 
对每个问题提供:
- 问题描述
- 严重程度
- 修复建议
- 最佳实践参考
5. 文档编写器(Documentation Writer)

工具配置

  • ✅ Codebase(代码库搜索)
  • ✅ Edit & Reapply(编辑)

指令示例

你是一个技术文档编写专家。生成的文档应该:
1. 清晰明了,易于理解
2. 包含完整的 JSDoc 注释
3. 提供使用示例
4. 说明参数、返回值和异常
5. 包含注意事项和最佳实践

使用自定义模式

切换模式

  1. 通过界面切换

    • 在 Chat 面板中,点击模式选择器下拉菜单
    • 选择要使用的自定义模式
  2. 通过快捷键切换

    • 默认快捷键:Ctrl/Cmd + .(点号)
    • 可以自定义快捷键

模式选择建议

任务类型推荐模式
调试错误Debug Assistant
重构代码Refactor Helper
生成测试Test Generator
代码审查Code Reviewer
编写文档Documentation Writer
日常开发默认模式

最佳实践

1. 为不同场景创建专门模式

不要试图创建一个”万能”模式,而是为不同场景创建专门优化的模式。

2. 指令要具体明确

指令越具体,Agent 的行为越可预测:

不好的指令

帮助调试代码

好的指令

你是一个调试助手。在提出修复方案前,请:
1. 仔细分析错误信息和堆栈跟踪
2. 检查相关配置和依赖
3. 提供可复现的测试步骤
4. 解释问题的根本原因

3. 工具配置要合理

只启用必要的工具,避免 Agent 执行不必要的操作:

  • 调试模式:需要 Terminal 和 Codebase
  • 文档模式:不需要 Terminal
  • 审查模式:不需要 Edit 权限

4. 定期优化模式

根据使用经验,不断优化模式的指令和工具配置。

5. 团队共享模式

如果团队使用 Cursor,可以:

  • 将模式配置保存在项目中
  • .cursor 目录下创建模式配置文件
  • 团队成员可以导入和使用相同的模式

模式配置文件示例

可以在项目根目录创建 .cursor/modes/ 目录,保存模式配置:

# .cursor/modes/debug-assistant.md
 
# Debug Assistant Mode
 
## Tools
- Codebase: enabled
- Terminal: enabled
- Edit & Reapply: enabled
- Web Search: enabled
 
## Instructions
你是一个专业的调试助手。在提出修复方案前,请:
1. 仔细分析错误信息和堆栈跟踪
2. 检查相关配置和依赖
3. 提供可复现的测试步骤
4. 解释问题的根本原因
5. 给出预防措施建议

Vibe-Coding 工作流

Vibe-Coding 是一种流畅、自然的编程工作流,通过 AI 辅助实现高效编码。

1. 工作流概述

Vibe-Coding 的核心是:描述需求 → AI 生成代码 → 快速迭代 → 持续优化

工作流步骤

1. 明确需求
   ↓
2. 使用 Chat 讨论方案
   ↓
3. 使用 Composer 生成代码
   ↓
4. 使用 Inline Edit 快速调整
   ↓
5. 代码审查和优化
   ↓
6. 测试验证
   ↓
7. 提交代码

2. 需求分析与方案设计

使用 Chat 讨论方案

快捷键Cmd/Ctrl + L 打开 Chat

示例对话

你:我需要实现一个用户登录功能,包含邮箱验证和密码强度检查

AI:好的,我建议:
1. 使用 React Hook Form 处理表单
2. 使用 Zod 进行表单验证
3. 密码强度检查:至少 8 位,包含大小写字母和数字
4. 邮箱格式验证

你:好的,请生成代码,使用 TypeScript 和 Tailwind CSS

明确技术栈和约束

在开始编码前,明确:

  • 使用的框架和库
  • 代码风格要求
  • 性能要求
  • 测试要求

3. 代码生成阶段

使用 Composer 生成代码

快捷键Cmd/Ctrl + I 打开 Composer

最佳实践

  1. 详细描述需求
创建一个用户登录组件,要求:
- 使用 React Hook Form 和 Zod 验证
- 邮箱格式验证
- 密码强度检查(至少 8 位,包含大小写和数字)
- 使用 Tailwind CSS 样式
- 包含错误提示
- TypeScript 类型定义完整
  1. 指定文件位置
在 src/components/auth/LoginForm.tsx 创建登录表单组件
  1. 引用相关文件
参考 @src/components/Button.tsx 的样式风格

使用 Tab 自动补全

工作流

  1. 开始输入代码
  2. AI 自动显示补全建议(灰色文本)
  3. Tab 接受建议
  4. Esc 拒绝建议

技巧

  • 输入函数名和参数,AI 会自动补全函数体
  • 输入注释,AI 会根据注释生成代码
  • 输入测试用例描述,AI 会生成测试代码

4. 快速迭代阶段

使用 Inline Edit 快速修改

快捷键Cmd/Ctrl + K

使用场景

  • 重命名变量
  • 提取函数
  • 添加类型定义
  • 优化代码逻辑

示例

  1. 选中代码块
  2. Cmd/Ctrl + K
  3. 输入指令:提取为独立函数,命名为 validateEmail
  4. AI 自动提取并替换

使用 Chat 进行微调

你:这个函数太长了,帮我拆分成更小的函数

AI:[分析代码] 我建议拆分为:
1. validateInput - 输入验证
2. processData - 数据处理
3. formatOutput - 输出格式化

你:好的,请执行

5. 代码审查阶段

AI 辅助代码审查

在 Chat 中请求代码审查:

请审查这段代码,检查:
1. 潜在 bug
2. 性能问题
3. 代码风格
4. 安全性问题
5. TypeScript 类型安全

自动修复问题

这段代码有 ESLint 错误,请修复

AI 会自动:

  • 修复 ESLint 错误
  • 优化代码格式
  • 添加缺失的类型定义
  • 修复潜在 bug

6. 测试生成

生成单元测试

为这个函数生成单元测试,使用 Jest 和 React Testing Library

生成集成测试

为这个登录流程生成集成测试,覆盖成功和失败场景

7. 文档生成

生成 JSDoc 注释

为这个函数生成 JSDoc 文档,包括:
- 函数描述
- 参数说明
- 返回值说明
- 使用示例
- 异常说明

生成 README

为这个组件生成 README,包括:
- 组件说明
- Props 说明
- 使用示例
- 注意事项

代码生成技巧

1. 编写有效的提示词

提示词结构

好的提示词应该包含:

  1. 上下文信息
在 React + TypeScript 项目中,使用 Tailwind CSS
  1. 具体需求
创建一个可复用的按钮组件,支持:
- 不同尺寸(small, medium, large)
- 不同变体(primary, secondary, danger)
- 加载状态
- 禁用状态
  1. 约束条件
- 必须通过 ESLint 检查
- 必须包含 TypeScript 类型定义
- 必须包含单元测试
- 遵循项目的代码风格
  1. 输出格式
请生成:
1. 组件代码
2. 类型定义
3. 单元测试
4. 使用示例

提示词示例对比

不好的提示词

创建一个按钮组件

好的提示词

在 src/components/ui/Button.tsx 创建一个可复用的按钮组件:

要求:
1. 使用 TypeScript 和 React 18
2. 支持尺寸:small, medium, large
3. 支持变体:primary, secondary, danger
4. 支持 loading 和 disabled 状态
5. 使用 Tailwind CSS 样式
6. 包含完整的 TypeScript 类型定义
7. 遵循项目的 ESLint 配置
8. 包含 JSDoc 注释

请生成组件代码和对应的单元测试文件

2. 分步骤生成复杂功能

大型功能拆分

对于复杂功能,分步骤生成:

步骤 1:数据结构设计

设计用户管理的数据结构,包括:
- 用户信息接口
- 状态管理结构
- API 响应类型

步骤 2:核心功能实现

实现用户列表展示功能,包括:
- 数据获取
- 列表渲染
- 分页功能

步骤 3:交互功能

添加用户搜索和筛选功能

步骤 4:优化和测试

优化性能并添加单元测试

3. 利用项目上下文

引用现有代码

参考 @src/components/Table.tsx 的实现方式,创建一个类似的用户列表组件

保持代码风格一致

参考项目中其他组件的代码风格,生成一个类似的组件

复用现有工具函数

使用 @src/utils/formatDate.ts 中的函数格式化日期

4. 代码生成最佳实践

生成前检查

  1. 确认需求清晰:需求描述是否完整?
  2. 确认技术栈:使用的框架和库是否正确?
  3. 确认约束条件:是否有特殊要求?

生成后验证

  1. 语法检查:代码是否能正常编译?
  2. 类型检查:TypeScript 类型是否正确?
  3. 规范检查:是否符合 ESLint 规则?
  4. 功能验证:代码是否满足需求?

代码质量保证

1. 类型安全

TypeScript 类型定义

要求

  • 所有函数参数和返回值必须有类型定义
  • 避免使用 any 类型
  • 使用联合类型和泛型提高类型安全

示例

// ❌ 不好的代码
function processUser(data: any) {
  return data.name;
}
 
// ✅ 好的代码
interface User {
  id: string;
  name: string;
  email: string;
}
 
function processUser(data: User): string {
  return data.name;
}

使用 AI 添加类型

为这个函数添加完整的 TypeScript 类型定义

2. 错误处理

完善的错误处理

要求

  • 所有异步操作必须有错误处理
  • 提供有意义的错误信息
  • 记录错误日志

示例

// ❌ 不好的代码
async function fetchUser(id: string) {
  const response = await fetch(`/api/users/${id}`);
  const data = await response.json();
  return data;
}
 
// ✅ 好的代码
async function fetchUser(id: string): Promise<User> {
  try {
    const response = await fetch(`/api/users/${id}`);
    
    if (!response.ok) {
      throw new Error(`Failed to fetch user: ${response.statusText}`);
    }
    
    const data = await response.json();
    return data;
  } catch (error) {
    console.error('Error fetching user:', error);
    throw new Error(`Unable to fetch user ${id}`);
  }
}

使用 AI 添加错误处理

为这个异步函数添加完善的错误处理

3. 代码规范

ESLint 规则遵循

自动修复

修复这个文件中的所有 ESLint 错误

检查特定规则

检查这段代码是否符合项目的 ESLint 配置

代码格式化

确保代码符合 Prettier 配置:

{
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode"
}

4. 性能优化

React 性能优化

使用 AI 优化组件

优化这个 React 组件的性能,包括:
1. 使用 React.memo 防止不必要的重渲染
2. 使用 useMemo 缓存计算结果
3. 使用 useCallback 缓存函数
4. 分析并优化渲染次数

代码分割

为这个路由组件添加代码分割,使用 React.lazy

5. 安全性检查

安全检查

检查这段代码是否存在安全漏洞,包括:
1. XSS 攻击风险
2. SQL 注入风险
3. 敏感信息泄露
4. 权限验证问题

代码审查与优化

1. AI 辅助代码审查

全面审查

在 Chat 中请求全面审查:

请全面审查这段代码,包括:
1. 代码质量和可读性
2. 性能问题
3. 安全性问题
4. 类型安全
5. 错误处理
6. 测试覆盖
7. 代码规范

专项审查

性能审查

分析这段代码的性能问题,并提供优化建议

安全审查

检查这段代码的安全漏洞

可维护性审查

评估这段代码的可维护性,提供改进建议

2. 代码重构

提取函数

将这段代码提取为独立函数,提高可读性

重构组件

重构这个组件,使其更易维护和测试

优化数据结构

优化这个数据结构,提高性能和可读性

3. 代码优化

性能优化

优化这段代码的性能,包括:
1. 减少不必要的计算
2. 优化循环和条件判断
3. 使用更高效的数据结构
4. 减少内存占用

可读性优化

优化这段代码的可读性,包括:
1. 提取魔法数字为常量
2. 使用有意义的变量名
3. 添加必要的注释
4. 简化复杂的条件判断

4. 测试覆盖

生成测试用例

为这个函数生成完整的单元测试,覆盖:
1. 正常情况
2. 边界情况
3. 错误情况
4. 异常情况

提高测试覆盖率

分析这个文件的测试覆盖率,生成缺失的测试用例

常见问题与解决方案

1. AI 生成的代码不符合规范

问题

AI 生成的代码不符合项目的 ESLint 或代码风格要求。

解决方案

  1. 在 .cursorrules 中明确规范
## 代码风格
- 遵循项目的 ESLint 配置
- 使用 Prettier 格式化
- 所有代码必须通过 lint 检查
  1. 生成后自动修复
修复这个文件中的所有 ESLint 错误
  1. 明确要求: 在生成代码时明确要求:
生成的代码必须通过 ESLint 检查,遵循项目的代码风格

2. 类型定义不完整

问题

AI 生成的代码缺少 TypeScript 类型定义。

解决方案

  1. 在 .cursorrules 中要求
## TypeScript 要求
- 所有函数必须有完整的类型定义
- 避免使用 any 类型
- 使用接口定义数据结构
  1. 生成后补充
为这个函数添加完整的 TypeScript 类型定义

3. 代码缺少错误处理

问题

AI 生成的代码缺少错误处理逻辑。

解决方案

  1. 在提示词中要求
生成的代码必须包含完善的错误处理
  1. 生成后添加
为这个异步函数添加错误处理

4. 代码性能问题

问题

AI 生成的代码存在性能问题。

解决方案

  1. 生成后优化
优化这段代码的性能
  1. 明确性能要求
生成的代码必须考虑性能,避免不必要的计算和渲染

5. 上下文理解不准确

问题

AI 对项目上下文理解不准确,生成的代码不符合项目架构。

解决方案

  1. 提供更多上下文
@src/components/Button.tsx 参考这个组件的实现方式
  1. 明确项目架构
这个项目使用 React + TypeScript + Zustand,请按照这个架构生成代码
  1. 分步骤生成: 先讨论方案,再生成代码。

最佳实践总结

1. 项目配置

必须做

  • 创建 .cursorrules 文件定义项目规范
  • 配置编辑器自动格式化和 ESLint 修复
  • 保持项目结构清晰

避免做

  • 不定义编码规范
  • 不配置代码质量检查
  • 项目结构混乱

2. 提示词编写

必须做

  • 提供清晰的上下文信息
  • 明确具体需求
  • 指定约束条件
  • 要求代码质量检查

避免做

  • 使用模糊的需求描述
  • 不指定技术栈
  • 不要求代码规范检查

3. 代码生成

必须做

  • 分步骤生成复杂功能
  • 生成后验证代码质量
  • 利用项目上下文
  • 保持代码风格一致

避免做

  • 一次性生成过于复杂的功能
  • 不验证生成的代码
  • 忽略项目现有代码风格

4. 代码审查

必须做

  • 生成后立即进行代码审查
  • 检查类型安全
  • 检查错误处理
  • 检查性能问题

避免做

  • 直接使用生成的代码
  • 不进行代码审查
  • 忽略潜在问题

5. 持续优化

必须做

  • 根据反馈持续优化提示词
  • 更新 .cursorrules 文件
  • 总结最佳实践
  • 分享经验

避免做

  • 不更新项目规范
  • 不总结经验
  • 不优化工作流

6. 工作流建议

日常开发流程

1. 明确需求 → 使用 Chat 讨论方案
2. 生成代码 → 使用 Composer 生成初始代码
3. 快速调整 → 使用 Inline Edit 和 Chat 微调
4. 代码审查 → 使用 AI 进行代码审查
5. 测试验证 → 生成测试并运行
6. 优化完善 → 根据测试结果优化
7. 提交代码 → 确保代码质量

代码质量检查清单

在提交代码前检查:

  • 代码通过 ESLint 检查
  • TypeScript 类型定义完整
  • 错误处理完善
  • 性能优化到位
  • 单元测试覆盖
  • 代码注释清晰
  • 符合项目规范

资源链接

官方资源

相关文档


更新日志

2025-01

  • ✅ 重构文档,聚焦编写规范可用的代码
  • ✅ 添加 Vibe-Coding 工作流
  • ✅ 完善代码质量保证章节
  • ✅ 添加代码审查与优化实践
  • ✅ 补充常见问题解决方案

最后更新:2025-01
维护建议:根据 Cursor 版本更新和项目实践,持续完善本文档


Cursor 开发工具 AI编程 代码规范 代码质量 VibeCoding