Steven W. 对Cursor中...
- 黄建同学
- 2024-12-28 07:05:07
Steven W. 对Cursor中.cursorrules的技巧总结↓
——
最近一直在学习 Cursor 的使用技巧，看到了几篇博客关于 .cursorrules 文件的技巧写的很好，我也做了一些总结分享给大家 ai创造营程序员
Ps. 尤其是小团队开发如果提前做好 .cursorrules 文件的配置，对代码规范性的帮助会很大
一、什么是 .cursorrules ？
.cursorrules 是一个存放在项目根目录的特殊文件，用于自定义 Cursor 中的 AI 辅助规则。
简单来说，.cursorrules 是您与 AI 之间的"沟通桥梁"。有了它，您不必每次都手动调整 AI 的行为，AI 将始终在您的项目需求范围内提供建议。
二、如何在项目中使用 .cursorrules？
1）创建文件： 在项目根目录创建 .cursorrules 文件。
2）定义规则： 按照上文的建议，定义项目背景、编码标准和文件结构等规则。
3）重启 Cursor： 在 Cursor 中，重启 AI 助手以加载新的 .cursorrules 文件。
4）实时调整： 当项目需求发生变化时，及时更新 .cursorrules 文件。
三、如何利用“AI 规则”实现全局控制？
可以的，Cursor 提供了全局的AI配置提示词。
配置的位置：File -> Preferences -> Cursor Settings -> Rules for AI
（图1）
这里再给大家提供一位大佬写的 Rules for AI 的案例作为参考。
（图2）
四、如何为项目创建最佳的 .cursorrules？
（图3）
1⃣提供项目背景
原因：
AI 不了解项目的背景，而背景信息可以帮助 AI 理解项目的上下文，生成更合适的代码。
示例：
```
（井号）项目背景
这是一个基于 Nextjs 的支持多语言的博客 Web 应用程序，使用 Nextjs 框架编写。
```
解释：
在 .cursorrules 文件的开头，您可以提供一个简要的项目背景介绍。像“这是一个基于 Nextjs 的博客 Web 应用程序” 这样的描述可以让 AI 在生成代码时，选择适合的语法风格、文件类型和方法。
2⃣定义编码标准
原因：
确保 AI 生成的代码符合团队的代码规范，避免不一致的编码风格。
示例：
```
（井号）编码标准
- 使用函数式组件和 Hooks，避免类组件
- 变量声明优先使用 const，而不是 let
- 变量和函数名使用 camelCase 规范，组件名使用 PascalCase
```
解释：
这段代码告诉 AI，团队更喜欢函数式组件，而不是类组件。AI 还会优先使用 const 声明变量，并在函数和变量命名中遵循 camelCase 规范，而组件名称采用 PascalCase。
3⃣指定首选的库和框架
原因：
如果 AI 不了解您首选的库，它可能会生成不适合的第三方依赖项。
示例：
```
（井号）首选的库
- 使用 Next.js 进行导航
- 使用 next-intl 做国际化
- 使用 tailwind 进行 CSS-in-JS 样式设计
```
解释：
这告诉 AI 在生成导航代码时优先使用 Next.js，而不是其他库（例如 React Router 路由系统）。对于样式，AI 会默认选择 tailwind，而不是 CSS 模块或其他 CSS 解决方案。
4⃣提供文件结构信息
原因：
清晰的文件结构可帮助 AI 生成的文件路径和导入路径更准确，减少路径错误。
示例：
```
（井号）文件结构
- components: 可复用的 UI 组件
- app/[locale]: 支持多语言的 nextjs 页面
- data/blog: 多语言的博客文件
- app/api: API 服务函数
```
解释：
告诉 AI 文件的目录结构有助于自动生成 import 路径。例如，当您要求 AI 创建一个新组件时，它会将其放入 src/components 目录，而不会错误地将其放入 src/pages 中。
5⃣设置性能优化指南
原因：
如果您不告诉 AI 关注性能，它可能会生成不符合性能最佳实践的代码。
示例：
```
（井号）性能优化指南
- 对纯函数组件使用 React.memo
- 路由组件实现懒加载
- 优化 useEffect 依赖，防止不必要的重新渲染
```
解释：
这些规则可帮助 AI 生成更高效的代码。例如，当 AI 生成 useEffect 钩子时，它会确保依赖项数组是完整的，从而防止不必要的重新渲染。
6⃣设定测试要求
原因：
如果您有特定的测试需求，AI 可以帮助您自动生成符合这些标准的测试用例。
示例：
```
（井号）测试要求
- 使用 Jest 和 React Testing Library 编写单元测试
- 测试覆盖率应至少达到 80%
- 对 UI 组件使用快照测试 (Snapshot Testing)
```
解释：
这段规则告诉 AI 在生成测试文件时使用 Jest 和 React Testing Library，还会自动生成快照测试 (Snapshot Testing) 以捕获 UI 变化。
7⃣编写文档规范
原因：
规范的文档有助于团队协作，并确保 AI 生成的代码自带注释和解释。
示例：
(井号)文档规范
- 使用 JSDoc 格式编写函数和组件的注释
- 组件必须包含 PropTypes 验证
- 每个主要目录必须包含 xx文件
- 同时提供英语和中文版本的 xx 文件
```
解释：
使用 JSDoc 规则可确保 AI 自动生成的函数和组件包含函数定义、参数说明和返回类型的注释。
8⃣设置错误处理偏好
原因：
AI 可能不会自动考虑错误处理逻辑。
示例：
```
（井号）错误处理
- 使用 try/catch 块处理异步操作
- 实现全局错误边界组件
```
错误处理
- 使用 try/catch 块处理异步操作
- 实现全局错误边界组件
```
解释：
这些规则告诉 AI 在生成异步函数时，自动在内部使用 try/catch 块。AI 还可能在项目中实现一个全局的“错误边界”组件，以捕获运行时错误。
五、.cursorrules 文件汇总网站
这里给大家提供一些汇总了各种语言的 .cursorrules 案例的网站或项目，大家可以作为参考
1. github.com/PatrickJS/awesome-cursorrules 2. cursorlist.com
3. cursor.directory
ChatGPT
——
最近一直在学习 Cursor 的使用技巧，看到了几篇博客关于 .cursorrules 文件的技巧写的很好，我也做了一些总结分享给大家 ai创造营程序员
Ps. 尤其是小团队开发如果提前做好 .cursorrules 文件的配置，对代码规范性的帮助会很大
一、什么是 .cursorrules ？
.cursorrules 是一个存放在项目根目录的特殊文件，用于自定义 Cursor 中的 AI 辅助规则。
简单来说，.cursorrules 是您与 AI 之间的"沟通桥梁"。有了它，您不必每次都手动调整 AI 的行为，AI 将始终在您的项目需求范围内提供建议。
二、如何在项目中使用 .cursorrules？
1）创建文件： 在项目根目录创建 .cursorrules 文件。
2）定义规则： 按照上文的建议，定义项目背景、编码标准和文件结构等规则。
3）重启 Cursor： 在 Cursor 中，重启 AI 助手以加载新的 .cursorrules 文件。
4）实时调整： 当项目需求发生变化时，及时更新 .cursorrules 文件。
三、如何利用“AI 规则”实现全局控制？
可以的，Cursor 提供了全局的AI配置提示词。
配置的位置：File -> Preferences -> Cursor Settings -> Rules for AI
（图1）
这里再给大家提供一位大佬写的 Rules for AI 的案例作为参考。
（图2）
四、如何为项目创建最佳的 .cursorrules？
（图3）
1⃣提供项目背景
原因：
AI 不了解项目的背景，而背景信息可以帮助 AI 理解项目的上下文，生成更合适的代码。
示例：
```
（井号）项目背景
这是一个基于 Nextjs 的支持多语言的博客 Web 应用程序，使用 Nextjs 框架编写。
```
解释：
在 .cursorrules 文件的开头，您可以提供一个简要的项目背景介绍。像“这是一个基于 Nextjs 的博客 Web 应用程序” 这样的描述可以让 AI 在生成代码时，选择适合的语法风格、文件类型和方法。
2⃣定义编码标准
原因：
确保 AI 生成的代码符合团队的代码规范，避免不一致的编码风格。
示例：
```
（井号）编码标准
- 使用函数式组件和 Hooks，避免类组件
- 变量声明优先使用 const，而不是 let
- 变量和函数名使用 camelCase 规范，组件名使用 PascalCase
```
解释：
这段代码告诉 AI，团队更喜欢函数式组件，而不是类组件。AI 还会优先使用 const 声明变量，并在函数和变量命名中遵循 camelCase 规范，而组件名称采用 PascalCase。
3⃣指定首选的库和框架
原因：
如果 AI 不了解您首选的库，它可能会生成不适合的第三方依赖项。
示例：
```
（井号）首选的库
- 使用 Next.js 进行导航
- 使用 next-intl 做国际化
- 使用 tailwind 进行 CSS-in-JS 样式设计
```
解释：
这告诉 AI 在生成导航代码时优先使用 Next.js，而不是其他库（例如 React Router 路由系统）。对于样式，AI 会默认选择 tailwind，而不是 CSS 模块或其他 CSS 解决方案。
4⃣提供文件结构信息
原因：
清晰的文件结构可帮助 AI 生成的文件路径和导入路径更准确，减少路径错误。
示例：
```
（井号）文件结构
- components: 可复用的 UI 组件
- app/[locale]: 支持多语言的 nextjs 页面
- data/blog: 多语言的博客文件
- app/api: API 服务函数
```
解释：
告诉 AI 文件的目录结构有助于自动生成 import 路径。例如，当您要求 AI 创建一个新组件时，它会将其放入 src/components 目录，而不会错误地将其放入 src/pages 中。
5⃣设置性能优化指南
原因：
如果您不告诉 AI 关注性能，它可能会生成不符合性能最佳实践的代码。
示例：
```
（井号）性能优化指南
- 对纯函数组件使用 React.memo
- 路由组件实现懒加载
- 优化 useEffect 依赖，防止不必要的重新渲染
```
解释：
这些规则可帮助 AI 生成更高效的代码。例如，当 AI 生成 useEffect 钩子时，它会确保依赖项数组是完整的，从而防止不必要的重新渲染。
6⃣设定测试要求
原因：
如果您有特定的测试需求，AI 可以帮助您自动生成符合这些标准的测试用例。
示例：
```
（井号）测试要求
- 使用 Jest 和 React Testing Library 编写单元测试
- 测试覆盖率应至少达到 80%
- 对 UI 组件使用快照测试 (Snapshot Testing)
```
解释：
这段规则告诉 AI 在生成测试文件时使用 Jest 和 React Testing Library，还会自动生成快照测试 (Snapshot Testing) 以捕获 UI 变化。
7⃣编写文档规范
原因：
规范的文档有助于团队协作，并确保 AI 生成的代码自带注释和解释。
示例：
(井号)文档规范
- 使用 JSDoc 格式编写函数和组件的注释
- 组件必须包含 PropTypes 验证
- 每个主要目录必须包含 xx文件
- 同时提供英语和中文版本的 xx 文件
```
解释：
使用 JSDoc 规则可确保 AI 自动生成的函数和组件包含函数定义、参数说明和返回类型的注释。
8⃣设置错误处理偏好
原因：
AI 可能不会自动考虑错误处理逻辑。
示例：
```
（井号）错误处理
- 使用 try/catch 块处理异步操作
- 实现全局错误边界组件
```
错误处理
- 使用 try/catch 块处理异步操作
- 实现全局错误边界组件
```
解释：
这些规则告诉 AI 在生成异步函数时，自动在内部使用 try/catch 块。AI 还可能在项目中实现一个全局的“错误边界”组件，以捕获运行时错误。
五、.cursorrules 文件汇总网站
这里给大家提供一些汇总了各种语言的 .cursorrules 案例的网站或项目，大家可以作为参考
1. github.com/PatrickJS/awesome-cursorrules 2. cursorlist.com
3. cursor.directory
ChatGPT
