【cursor】AI时代,打不过就加入

1,336 阅读5分钟

Cursor 使用指南

1.  快速入门

1.1 什么是 Cursor?

简单来说,Cursor 是一个带 AI 功能的代码编辑器,就像是 VSCode 加上了 ChatGPT和GitHub Copilot 。它可以帮你:

● 自动补全代码

● 回答编程问题

● 生成和修改代码

● 解释代码含义

1.2 为什么选择 Cursor?

Cursor基于VSCode开发,增加了AI创建、编辑和提示代码的功能。相当于集合了GitHub Copilot 和ChatGPT,并能够自动从0开始创建一个完整的项目。

● Cursor Tab:实时 AI 代码补全,类似GitHub Copilot;

● Composer:直接生成和编辑代码;

● Chat:自然语言编程对话,类似ChatGPT;

● 多语言支持;

● 与 VSCode 生态系统兼容。(Cursor项目是从VSCode fork而来)

1.3 如何安装

1.  打开官网 www.cursor.com/

2.  点击下载按钮,选择对应系统版本

3.  安装完成后打开,使用邮箱注册/登录即可

2. 日常使用技巧

2.1 最常用的快捷键

基础操作:

功能快捷键(windows)快捷键(Mac)
接受 AI 代码建议TabTab
打开 AI 聊天Ctrl + LCmd + L
AI 生成/编辑代码Ctrl + ICmd + I

2.2 实用场景示例

场景一:让 AI 解释代码

1.  选中要理解的代码

2.  按 Ctrl + L(Mac 用 Cmd + L)

3.  输入:"请解释这段代码的作用"

场景二:让 AI 优化代码

4.  选中需要优化的代码

5.  按 Ctrl + I(Mac 用 Cmd + I)

6.  输入:"请优化这段代码,主要考虑性能方面"

场景三:让 AI 生成代码

7.  按 Ctrl + I(Mac 用 Cmd + I)

8.  描述你的需求,例如:

9.  "帮我写一个 React 函数组件,实现一个待办事项列表,包含添加、删除功能"

3. Cursor 核心功能使用指南

3.1 代码补全

使用方式:

实时补全

● 开始输入代码时自动触发

● 使用 Tab 接受建议

● 使用方向键选择不同建议

命令式补全

1.  选中代码块

2.  按下 Ctrl + K

3.  输入指令如 "补全(完善)这个代码"

3.2 AI 对话

使用方式:

按下Ctrl + L 在右侧打开Chat面板

注意事项:

tips:

一个好的Input才能带来好的Output,简而言之,想要AI的结果更准确,那么你的提示语和描述就应该更贴切。

好的提问方式:

✅ "请帮我实现一个登录表单,需要包含用户名和密码字段,使用 React 和 antd"

✅ "这段代码有什么可以改进的地方?主要考虑代码复用性"

✅ "能否解释一下这个函数的参数分别是什么作用?"

避免这样提问:

❌ "这代码有问题"

❌ "帮我写个组件"

❌ "这是干什么的?"

3.3 Cursor Composer

什么是Composer?

Composer直译为“作家,作曲家”,这里比喻为“代码的作家,创作代码的人”。在Cursor中,composer拥有生成/修改文件夹或文件的能力。因此,可以使用composer来直接创建一个新项目,编写一个全局组件等等。

使用方式:

按 Ctrl + I打开Composer面板,直接描述需求。

例如:

image.png tips:

● 可以给出指令“改动前先复述一下我的需求,等我确认之后再继续”确保AI没有误解我们的需求。

● 可以给出指令“不要改动其他的UI和结构代码”确保AI不会修改到其他部分的UI。

4. 进阶使用技巧

4.1 项目级 AI 助手

4.1.1 全局代码理解(如果想要更全面的安全和隐私,可以不开启此功能,并且可以打开隐私模式)

Codebase 是cursor理解代码的一个重要“仓库”,基于Codebase可以做到:

● 项目依赖分析

● 代码结构优化建议

● 类型系统完善

使用方式:

1.  打开右上角cursor设置,选择Features ,点击同步代码Index(这里可以点击开启 Index new folders by default );

image.png

2.  打开 Chat (Ctrl + L) 或 Composer(Ctrl + i)面板,输入“@”选择Codebase,然后开始提问。

image.png 3.  输入提问,比如:“请阅读我整个项目的代码,提炼出关键技术点。列出存在哪些问题,给出优化方案。开始之前先复述我的需求,待我确认之后再继续。”

4.1.2 利用规则配置提高AI的效率

什么是规则?

cursor中可以配置rules规则来约束AI,提高AI的效率,可以理解为提前告诉AI一些前提条件,让AI在后续的理解和编码中能够按照我们的约束,以更高效的方式来工作。

在cursor中有以下两种方式来配置规则:

1.  全局规则配置

a.  打开cursor设置,选择 “General” 在 “Rules for AI” 中书写你的全局配置规则。例如:“总是使用中文回答我, 总是使用React 函数式组件”。

image.png

2.  局部规则配置

a.  在项目根目录创建一个 .cursorrules 文件,在该文件中填入如下图内容:

image.png

值得一提的是,我们无需从头开始书写 .cursorrules ,而是可以借助像cursor.directory/cursorrules.agnt.one/chat

github.com/PatrickJS/a… 网站来复制规则模板,然后根据自身项目需求动态调整。

5. 最佳实践

5.1 配置规则文件提高效率

按照上述规则配置文档,完成全局或者局部的 cursor 规则配置,比如从代码规范,编码习惯,项目基本结构,项目目标等方面,对cursor做一个基本的约束和前情提要。

5.2 使用 AI对话 完善需求

然后,梳理自己的需求,可以要求cursor协助修改,优化需求。然后生成一个最终的基本需求文档。

5.3 使用Cursor Composer 生成基本代码结构

最后,将梳理好的文档复制到Composer 对话框中,可以提示cursor在开始编码之前先复述自己的需求,等确认无误之后再开始创建/修改代码。

6. 故障排除

6.1 常见问题

1.  AI 响应慢:

✔️ 检查网络连接

✔️ 清除缓存

✔️ 重启编辑器

2.  代码补全不准确:

✔️ 更新项目依赖

✔️ 确保 tsconfig.json 配置正确

✔️ 提供更多上下文信息