【AI智能体】Cursor 进阶高级使用技巧实战操作详解

【AI智能体】Cursor 进阶高级使用技巧实战操作详解
目录一、前言二、Cursor 介绍2.1 Cursor 是什么2.2 Cursor 核心特性2.3 Cursor与传统IDE区别2.4 Cursor与传统IDE核心差异总结三、Cursor 进阶高级技巧案例使用3.1 TAB 使用3.1.1 代码/注释自动补全3.1.2 TAB 键深度使用3.2 Cursor 内联智能使用3.2.1 什么是内联智能3.2.2 内联智能核心特点3.2.3 内联智能技术实现要点3.2.4 内联智能案例场景使用3.2.4.1 代码补全3.2.4.2 生成注释3.3 Cursor 精准上下文使用3.3.1 什么是Cursor 的精准上下文3.3.2 精准上下文命令汇聚3.3.3 使用案例3.3.3.1 文件引用3.3.3.2 web 链接引用3.4 Cursor Rules 规则配置3.4.1 什么是 Cursor Rules3.4.2 Cursor 规则文件作用3.4.3 Cursor Rules 分级与存放位置3.4.4 创建规则文件3.4.5 规则应用3.4.6 规则文件使用示例3.4.7 规则文件如何编写3.4.8 使用技巧补充3.5 Cursor 对接Skills3.5.1 对接入口四、写在文末一、前言在过去的很长一段时间里Cursor 被誉为最全能的 AI 工具它不仅是一个编程 Agent更是一个几乎可以替换掉任何对话工具的全能 AI。Cursor 的出现让很多软件工程师大开眼界从而打开了一扇从传统编程进入到AI编程的新时代可以说只要你能想到的场景Cursor 都能帮你自动化完成。借助Cursor 不仅可以大大提升编程效率而且对着技术的发展Cursor 的功能也越来越完善不仅可以做AI编程在更多的领域都展示出了强大的能力本篇将详细介绍Cursor 的一些进阶高级使用技巧。二、Cursor 介绍2.1 Cursor 是什么Cursor是一个类VSCode的智能编程IDE集成了GPT-4、Claude3.5等先进大语言模型(LLM)本质上是一个内置AI助手的VSCode。它不仅支持自然语言编程还提供从代码编写、调试、重构到部署的智能辅助。你可以像和人交流一样与AI协作大幅提升开发效率和代码质量。官网https://cursor.com/2.2 Cursor 核心特性Cursor 主要包括如下核心特点AI原生设计:从底层架构就融入了AI能力而非后期添加的插件智能代码生成:通过自然语言描述快速生成代码片段上下文感知:深度理解项目结构和代码关系实时协助:在编程过程中提供即时的建议和优化多模型支持:集成了多种先进的大语言模型2.3 Cursor与传统IDE区别Cursor与传统IDE主要有下面的区别功能特性传统IDECursor代码补全基于语法分析和已有代码的静态补全AI驱动的智能补全理解上下文和意图代码生成依靠预设模板和代码片段通过自然语言描述生成完整代码逻辑问题解决需要手动查找文档、Stack Overflow等内置AI助手即时解答编程问题代码理解提供语法高亮和基础结构分析深度理解代码逻辑提供详细解释重构优化手动操作依赖开发者经验AI智能分析并建议最佳重构方案学习支持需要外部资料和文档内置技术知识实时学习辅导错误处理显示编译错误和基础语法检查预测潜在问题提供修复建议和解释2.4 Cursor与传统IDE核心差异总结与传统的IDE相比具有如下的核心差异对比维度传统IDECursor交互方式基于菜单、快捷键的工具操作自然语言对话传统操作学习曲线需要记忆大量快捷键和功能位置通过对话快速上手降低学习门槛开发效率依赖开发者经验和熟练度AI辅助显著提升编码速度代码质量主要依靠开发者技能水平AI持续提供最佳实践建议知识获取需要主动搜索和学习被动接收AI推荐和解释问题诊断基于错误信息手动排查AI分析问题根源并提供解决方案创新能力受限于开发者知识范围AI提供多样化解决思路适用人群需要一定编程基础适合各个水平的开发者三、Cursor 进阶高级技巧案例使用接下来通过实际案例详细介绍下在Cursor 中的一些进阶高级使用技巧。3.1 TAB 使用Cursor Tab是我们本地的自动补全功能。它是一个更强大的Copilot能够建议整个差异并具有特别好的记忆。在光标周围建议编辑而不仅仅是插入额外的代码。同时修改多行。根据您最近的更改和linter 错误提出建议。它的作用很多下面分别介绍。3.1.1 代码/注释自动补全我们使用ctrlK给Ai agent命令让其生成一段可以测试 Tab按键的python代码当我将首行注释时python代码由于无法识别tk是什么而产生报错(可以看到第一行文字颜色稍浅是tab功能的提示输入)让我们尝试将第一段删除并敲击键盘上的tab键进行使用。同时在编写程序时Cursor有时候也会帮我们自动注释这时敲击TAB可以注释。在上面的图中我写了几个注释在某个注释的后面只需要按下 TAB键Cursor 将自动为我生成符合注释要求的代码同时会发现第一个注释后面的代码生成之后TAB键自动跳转到下一个位置去了Tab自动补全后先点击右上角三角小箭头是启动功能然后会生成我们代码的结果小窗口(测试Tab功能的程序并能够进行直接测试)可以点击运行在终端很方便的看效果3.1.2 TAB 键深度使用Tab: 按Tab键接受整个建议Esc: 按Esc键拒绝整个建议Ctrl一: 逐字接受建议Tab会预测开发者接下来可能需要编辑的位置并在接受当前修改后自动建议跳转到下一个相关位置。只需再次按下Tab键即可快速跳转极大减少了鼠标操作和手动寻找的时间。在某些项目中当我们有多个文件时Tab也会帮我们预测下个文件功能的位置敲击Tab进行文件的跳转。在第三段注释代码刚刚生成并接受之后TAB 键自动预测并跳转到了下一个注释的位置3.2 Cursor 内联智能使用3.2.1 什么是内联智能内联智能顾名思义就是指智能功能直接嵌入在代码编辑器的编辑界面内与代码内容无缝结合实时显示和交互帮助开发者在编写代码的“行内”获得智能辅助。换句话说内联智能就是把 AI 的能力“贴近代码”在开发者写代码时直接在代码旁边、行内或特定位置给出提示、补全、注释、建议等信息无需跳转窗口或打开其他面板。3.2.2 内联智能核心特点内联智能具有如下核心特点特点说明实时性随代码输入即时触发反馈快速上下文感知基于当前文件乃至整个项目的代码上下文进行智能推断无缝集成直接显示在代码编辑区域不打断开发者思路交互便捷集成代码补全、错误提示、重构建议、文档注释等多种智能功能多功能融合集成代码补全、错误提示、重构建议、文档注释等多种智能功能3.2.3 内联智能技术实现要点特点说明上下文感知语义理解结合语法树AST、类型信息、代码调用关系进行深度语义解析模型推理与缓存机制采用大模型推理辅助决策并缓存历史结果减少延迟编辑器插件集成通过 VSCode、IntelliJ 等编辑器扩展实现 UI 层和交互层支持事件驱动机制监听代码输入、保存、切换文件等事件触发智能响应异步反馈与并发处理保证智能提示不会阻塞编辑体验异步加载和更新内容3.2.4 内联智能案例场景使用内联智能在日常编程开发中有比较多的使用场景具体来说智能代码补全在开发者输入代码时内联智能能结合上下文和历史记录推荐最合适的代码片段或函数调用例如输入变量名、函数名时自动提示匹配项并支持快速选取代码错误和警告提示直接在代码行内或旁边标注语法错误、潜在逻辑漏洞例如拼写错误、类型不匹配、变量未定义等即时警告重构建议和代码优化在相关代码处提示重构可能性比如函数拆分、命名优化、循环简化鼓励代码规范化、模块化提升可维护性生成文档注释在函数定义或类上方内联提示缺少注释提供自动生成选项帮助快速补全符合规范的 API 文档单元测试建议代码变更时内联提示可能需要新增或修改的测试用例支持快速跳转生成测试代码模板下面通过几个实际案例演示一下。3.2.4.1 代码补全如下当我们在一个文件中写下一段注释然后按下TAB键的时候Cursor 自动理解注释的含义然后生成代码按下TAB键之后代码就自动添加在注释下方也可以通过 Ctrl K 的快捷键调出局部对话框如下在小窗口中给出提示词然后点击小箭头确认然后就在下方快速生成了代码3.2.4.2 生成注释选中某个方法块生成代码的注释生成之后按照提示选中即可3.3 Cursor 精准上下文使用3.3.1 什么是Cursor 的精准上下文Cursor的“精准上下文”核心就是使用符号系统。你可以把它理解为给AI的“精确引用”让AI不再靠猜而是直接定位到你指定的代码、文件甚至网络文档从而实现手术刀般的精准操作。可以看到在对话框中输入之后下拉很多选项可以使用在日常编程开发中可以借助这些选项辅助完成很多开发、问题排查、数据分析等工作。3.3.2 精准上下文命令汇聚下面我将核心的命令整理成了下面的速查表命令作用典型场景举例Files引用一个或多个特定文件“参照src/components/Button.tsx的写法新建一个Link.tsx组件。”Folders引用整个文件夹提供更广泛的上下文“检查src/api/v1这个文件夹下所有接口看哪里缺少身份验证中间件。”Code/Symbols引用代码中的特定函数、类或变量“重构useUserData这个 Hook用 React Query 替代本地状态管理。”Docs为AI提供外部文档知识避免它“胡编乱造”“根据React Router的官方文档帮我写一个需要身份验证的路由守卫。”Web让AI进行实时在线搜索获取最新信息“帮我查一下 Node.js 最新的稳定版本是什么Web”Git引用Git提交历史或差异用于审查代码或生成提交信息“根据我暂存的更改写一条提交信息。Git”Lint Errors引用编辑器中所有的代码检查错误“帮我修复Lint Errors里列出的所有问题。”Codebase让AI理解整个项目回答全局性问题主要用于聊天模式“这个项目里的用户认证流程是怎样的Codebase”使用技巧这些命令可以组合使用为AI提供更丰富的上下文。例如你可以问“参照Button.tsx的样式修复Lint Errors中关于Header.tsx的问题。”3.3.3 使用案例接下来通过几个实际案例分享一下Cursor精准上下文的用法。3.3.3.1 文件引用通过或者直接拖拽文件的方式也可以通过文件的方式可以某个具体的文件也可以是某个文件夹或者文档3.3.3.2 web 链接引用可以在Curosr 中直接引用外链文档Curosr 可以读取外部链接文档信息进行加载、分析、处理比如这里引用一个微信官方的对接文档让Cursor 为我生成一个对接的流程梳理稍作等待之后Cursor 将对接的过程做了详细的整理并输出出来中其他的功能都可以参考上面的方式做一些尝试使用起来大同小异3.4 Cursor Rules 规则配置3.4.1 什么是 Cursor RulesCursor Rules中文翻译过来是 Cursor 规则。就是给Cursor制定一系列规则约束AI生成的代码。Cursor 的规则系统是让 AI 按照你的技术栈、代码规范和项目架构来生成代码的关键。通过配置.cursor/rules/*.mdc文件你可以告诉 AI 你是谁、项目用什么技术以及代码该怎么写当一条规则被触发后规则中的内容会被附加到提示词中为 AI 提供参考无论是在自动补全、 代码生成、重构还是错误修复时都能遵循这些规范3.4.2 Cursor 规则文件作用规则文件具有下面的作用指明项目所使用的技术栈Vue 3, Element Plus, Pinia, TypeScript, Vite明确项目约定组件/文件命名、CSS 命名、导入顺序避免误判减少 Cursor 提供的错误补全或重复实现已有功能提升智能度帮助 AI 生成符合项目风格、结构规范、命名约定的代3.4.3 Cursor Rules 分级与存放位置之前接触过Claude Code 的同学应该不陌生Claude Code中的规则配置分全局和项目级别在 Cursor 当中也不例外它支持两种级别的规则全局规则User Rules针对所有项目通用的规则项目规则Project Rules存放于项目目录下的 .cursor/rules 中只用于约束当前项目规则文件放在项目根目录下的.cursor/rules/文件夹中使用.mdc格式your-project/ ├── .cursor/ │ └── rules/ │ ├── typescript.mdc # TypeScript 规范 │ ├── components.mdc # 组件规范 │ └── api.mdc # API 规范 ├── src/ └── ...⚠️ 注意旧的.cursorrules单文件方式已不再推荐新项目请使用.cursor/rules/多文件方式。对上面的规则文件目录位置做一些补充说明 路径固定必须为 .cursor/rules/ 扩展名固定必须为 .mdc✅文件可以有多个每个规则建议单独拆分主题编写如 unocss-guidelines.mdc, project-structure.mdc, naming-conventions.mdc 等3.4.4 创建规则文件可以手动创建规则文件也可以通过内置的命令创建手动创建方式如下说明文件名可自定义扩展名必须为 .mdc# 第一步创建规则文件的目录 mkdir -p .cursor/rules #创建规则文件 touch .cursor/rules/project-guidelines.mdc如果是自动创建打开Cursor 的编辑器Chat窗口输入 / 并选择弹出的 Generate Cursor Rules 选项即可自动生成 .cursor/rules/ 目录及默认的规则文件我们用第二种方式来尝试一下按照上一步选中了 / create-rule 之后在后面输入下面的提示词经过一会儿的等待后Cursor 读懂了我制定模块的项目为我生成了项目介绍文档并且是mdc格式的3.4.5 规则应用规则文件创建出来后进入规则文件可以看到上面有个下拉框提供了几个选项这几个选项的含义如下Always始终应用规则想始终生效Auto Attached当匹配 globs 模式的文件被引用时自动附加规则想自动触发用Agent Requested根据 AI 代理的判断决定是否应用规则需要提供规则说明想让 AI 自己决定是否用Manual仅在提示中显式使用 规则名 时附加规则。想手动调用规则3.4.6 规则文件使用示例首先让Cursor 读懂项目之后生成一个API 设计规则然后基于这个规则编写接口给出如下提示词读懂 gh-pda 模块的项目开发规范然后生成一个API 接口设计规范后续我就与你共同持续完善这个接口设计文档最后Cursor 为我们生成了我指定模块的api接口设计规范实际使用时还需要人工进行二次校对、完善这个文档打开这份文档后我选择了手动引用然后在对话框那里可以看到已经可以看到上述创建成功的文件了接下来基于创建的API设计规则文件让Cursor 生成接口通过过程输出日志可以看到Cursor 参考了上述的接口设计规范文档最终生成的接口完全符合预期的要求3.4.7 规则文件如何编写在上述案例操作中演示了项目规则文件如何从0到1创建出来事实上如果你的项目已经比较成熟稳定上面这种方式是最快捷的如果你的项目还在规划、设计和成型中可以手动编写可以先制定API接口设计规范后续再进行丰富完善即可而规则文件内部的内容网上有很多资料首先文档格式必须为.mdc 结尾本质就是是 Markdown 文档但具有特殊结构。以下以开源项目 vue3-element-admin 为例给出适用于 Vue 3 TypeScript 项目的推荐规则模板写法可做参考# 项目基础说明 - 本项目基于 Vue 3 TypeScript Element Plus Pinia Vite 搭建。 - 采用组合式 APIscript setup langts进行开发。 - 状态管理使用 Pinia模块化组织。 - 路由使用 Vue Router采用权限动态路由配置。 - 接口请求统一封装在 /utils/request.ts 中使用 Axios。 - 表格、表单页面基于 Element Plus 封装通用组件提高复用性。 # 组件和文件命名规范 - 组件文件名使用 PascalCase 格式例如UserTable.vue, LoginForm.vue - 公共组件放置在 src/components/ 下业务组件可放在 src/views/模块/components/ 中 - 文件夹名和非组件 .ts/.scss 文件使用 kebab-case 格式例如user-api.ts, login form.scss - 页面文件命名与路由保持一致使用 kebab-case例如user-list.vue, role-edit.vue # 样式和 CSS 使用约定 - **优先使用原子类** 使用 UnoCSS 提供的原子类进行布局和样式例如常见的 flex 布局flex justify-center items-center 等。样式语义明确便于维护。 - **常用组合提取为全局快捷方式** 对于**频繁使用**的原子类组合应在 unocss.config.ts 中 通过 shortcuts 定义全局组合类。例如将 flex justify-center items-center 定义为 flex-center这样可以在整个项目中复用。组合类命名应简洁且语义化反映布局或功能意图。 - **非常用组合使用局部类** 对于特定组件中使用但不常见的、超过3个的原子类组合应该在组件内使 用局部CSS类使用style scoped块避免过多的全局组合污染全局命名空间。 - **避免重复代码** 不论是通过全局shortcuts还是局部CSS类都应避免在多个地方重复编写相同 的原子类列表保持代码 DRYDont Repeat Yourself原则。 - **样式优先级** 优先考虑 UnoCSS 解决方案原子类或组合类其次才是传统 CSS。当需要使用传 统 CSS 时遵循 BEM 命名规范即 block__element--modifier 格式。 # 导入顺序规范保持统一结构 1. Vue 相关 API如 ref, computed, onMounted 2. 第三方库如 element-plus, axios 3. 工具函数如 /utils/* 4. 状态管理如 /store/* 5. 项目内部组件、模块如 /components, /views 6. 样式文件 # 开发注意事项 - 使用 TypeScript避免使用 any - 组件职责单一保持结构清晰 - 所有组件必须使用组合式 API - 适当添加注释提升 AI 理解。3.4.8 使用技巧补充下面再结合实际经验补充一些常用的使用技巧拆分规则主题 可以为不同模块分别写规则比如 style-guidelines.mdc、project-structure.mdc、component-conventions.mdc让 AI 更易查阅上下文越具体越好 你越明确规则Cursor 越能准确给出符合你期望的代码。避免废话和废规则 Focuson 可执行、可操作、可验证的规则。比如“命名要清晰”不如“类名采用 BEM 规范并用小写字母连接” 具体有效随项目迭代更新规则 规则应当与代码保持同步更新特别是引入新的库、工具、编码风格变更时3.5 Cursor 对接SkillsSkills在日常的工作中使用非常频繁Cursor 中对接Skills非常方便下面简单做一些介绍。3.5.1 对接入口如下通过聊天对话设置在设置选项中有一个配置Skills的入口如果你想添加新的skill进来点击 New 按钮会自动跳转到一个新的对话框这个意思是Cursor 可以按照你的需求描述创建一个skill并加载进去如果本地你已经提前创建或者拥有了一些skill可以直接通过对话将其加载到cursor 中比如这里面就是我本地安装的飞书相关的skill接下来我给一个飞书链接让Cursor 借助飞书的skill读取文档信息通过过程输出日志不难看出中间调用了与飞书相关的skill最终按照预期要求将文档中的关键信息整理并输出了出来四、写在文末本文通过较大的篇幅详细介绍了Cursor 中一些进阶的高级使用技巧Cursor的功能远不止于此有兴趣的同学还可以在此基础上继续深入研究本篇到此结束感谢观看。