一文了解Cursor使用方法和技巧

认识 Cursor

一句话总结:基于 VScode 全方位集成 AI 的一款代码编辑器。

常用功能官网介绍的非常详细,可以浏览一遍:https://www.cursor.com/cn/features

打开 Cursor Setting,有一些常用设置:

企业内用可以先把隐私模式打开:

除了上一代编码辅助 copilot 的 TAB 补全、问答,最关键的是增加了agent 模式,可以自主完成某一个具体的目标。

模型一般选择 claude-3.5,或者 claude-3.7(claude 3.7 实测:在实际编程任务中提升到底有多大?, 刚出不久,效果目前褒贬不一),

Agent 模式下可以自己执行命令行脚本、自主修复 lint 错误、自主跑 build 修复相应报错,也可以让它跑单测再自主修复。

可以开启 yolo 模式,跑命令行时候不需要二次确认。安全起见,也提供了一些禁止执行的命令的配置。

增加了代码库的索引,可以基于整个代码库来完成一些事情。Ask 模式下可以主动 @Codebase ,Agent 模式下会主动搜寻整个仓库。

可以在设置中查看是否索引了整个项目:

聊天中比较常用的就是 @ ,可以 @ 文件,@ 文档,@ git 等等,对于文件也可以直接做左边目录树拖动到对话框。

提前索引文档:

查看执行的历史,甚至可以并行让它执行多个:

Pro 版本每月 $20,可以通过 wildcard 虚拟信用卡 充值。每月 500 次快速请求,用完以后慢速请求体感影响不是很大:

Cursor 把我们从编码细节中解放出来,从原来 ChatGPT 对话粘贴再对话的模式变成了仅对话的一条龙服务,我们只需要等待它写代码,然后审查代码或者功能继续对话,在等待过程中还可以继续做其他事情。

我们只需要告诉它我们想要做什么,具体该怎么做由它自己规划即可。

Cursor 使用案例

分渠道 eslint 需求

需求背景

公司代码在微信小程序、美团、优选 app、微信美团小程序 4 个渠道复用,代码中支持分渠道编译进行一些差异化逻辑,例如下边的代码:

1
2
3
4
5
6
7
8
9
// @if p == 'wx' || p == 'wxmt'
import { getDpApp } from '@yxmp/root/xxxxxx';
// @endif

function isReportToUnicorn() {
const app = getDpApp();
abForUnicorn = app?.$abTest?.isGrey('grocery_c_front_xxxxxx', 'a') || false;
return abForUnicorn;
}

此时如果直接调用 getDpApp 就会引发线上问题,因为编译后 getDpApp 只在 wx(微信小程序) 和 wxmt(美团小程序) 中出现,美团和优选 app 中没有引入。

但普通的 eslint 的检查对这种问题并不能及时检查出来,因为 // @if p == 'wx' || p == 'wxmt' 对于 eslint 只是普通的注释。

因此,需要对编译后的 4 个渠道再依次过一遍 eslint 检查及时暴露问题。

快速开发

eslint 校验所在的项目是我第一次写,在 Cursor 出现之前可能要慢慢熟悉各个功能,然后再输出调试验证自己的想法。

但 Cursor 出现之后就变了,我们只需要拆解任务,告诉 ai 我们想干什么,让它直接去执行就可以。很可能功能已经完成了,我们都不知道发生了什么。

这个事情其实就是两个步骤:

1、生成 4 个渠道编译后的文件,然后传出去

接着需要几次修复,比如我们渠道中还有 tt,它也直接给加上了,可以让它去掉:

运行报错直接错误可以把命令行的错误贴给它:

由于它没有项目相关的背景知识,生成编译后的内容不符合预期。但如果知道项目中已经有一个编译方法了(同事提前告诉了我),然后直接告诉 ai 就可以:

由于之前 Cursor 尝试了自己的方法,多了一些废代码,也可以让它删一下

刚刚是直接生成了四个渠道的内容,对应的 files 没返回,然后又让它调整了下返回的内容结构:

2、根据四个渠道生成的内容再分别走一遍 lint。

接着 Cursor 就生产了我们需要的代码,到这里整个链路其实已经跑通了。而且这里令人惊喜的是,Cursor 对于 eslint 的使用比我熟悉。

比如原项目中是调用 lintFiles 进行 lint,接收的参数是路径。但因为我们是生成了文件内容,lintFiles 已经调用不了了,但它自己决定换成了lintText 来检查代码。

接着优化输出内容区分一下输出的渠道:

简单看下代码改动,再让它优化一下:

因为原来 lintFiles 和这次新增的 lintText 的结果都需要格式化输出,它就把格式化方法抽了一个公共方法来调用。

不管代码懂没懂,本次需求的功能其实已经实现了,啪的一下,很快。

但因为技术方案还没写,具体流程还需要再和同事对一下,直接让 Cursor 帮我们生成一个本次的改动文档:

当然上边两句话最好一起说,不然它只会在对话框输出,直接生成文件看会方便一些。它的图片是通过 mermaid 生成的,安装一个插件就可以直接在 Cursor 中预览流程图了。

生成的文档基本可用,并且图文并茂:

继续完善

和同事对完之后,确认了一些细节,继续和 Cursor 聊聊。

因为直接把所有文件内容透传给了 eslint,会有内存问题,因此改完传递一个编译函数进去。

好,改完了,需要拉入相关人进入正式的技术方案评审以及直接进入 code review 了,因为代码已经写完了。

让 Cursor 再生成一个新的技术文档,直接告诉它是哪几个 commit:

流程图很详细,把改动点也区分了出来:

除了技术方案,Cursor 给了我们一个优化建议:

好,那让它优化下吧:

技术方案还需要测试计划,根据自己的想法让 Cursor 帮忙示例

code review 之后再调整

之前批处理写死了一个 10,cr 评论建议改为 horn(配置平台)动态下发,给 Cursor 描述一下:

优化 ts:

eslint 分渠道治理

测试过程中发现现存有不少可能引发线上问题的 eslint 错误,此时需要一个文档,拉相关人来一起排查修复下,把生成结果一个一个复制?不存的,同样交给 Cursor:

生成的表格预览之后可以直接复制到文档中了:

至此,一行代码没写的需求完成了。

编码但不止于编码

Cursor 已经不仅仅是代码辅助了,可以看到上边已经完成了技术方案的编写,它还有更多的用法。限制它的作用的不再是它的能力,而是我们的想象力了

RAG

RAG(Retrieval-Augmented Generation)是一种结合信息检索(Retrieval)和生成式 AI(Generation)的技术,先从外部知识库检索相关信息,再利用大模型生成更准确、上下文丰富的回答,常用于问答系统和知识管理。

因为 Cursor 有了索引整个仓库的能力,我们只需要把所有文档放到一个文件夹中,等待索引完成,就可以问它文档相关的问题了。

代码理解能力

对于不了解的项目,如果快速知道某一个点。比如某一个 btn 的埋点 bid 是什么,可以直接问他:

需要注意的是 Cursor 默认不索引 .gitignore 中的文件。

处理excel

excel 有 4 个 sheet,有一些灰色的行,我想把灰色的行都去掉:

直接让 Cursor 读取然后处理:

更多

… …

和 Cursor 对话经验

  • 及时 commit,到可用点之后及时提交代码再和他继续对话,方便我们回退

  • 拆分大目标到一个个小目标,让它依次完成

  • 越明确执行的越好,但这个度需要不断体会

  • 多个小对话放到一个对话中完成,比如一直和它对话了多轮,可能会出现改了后边的坏了前边的,尤其是 ui 方面的。此时可以编辑原对话或者新建一个会话,把所有的要求一次性给它

Cursor 持续探索

Cursor 可以不断扩展的核心是 Cursor rules(每次请求前都会把 Cursor rules 传到对话中),比如 awesome 项目提供的一些:https://github.com/PatrickJS/awesome-cursorrules

目前 Cursor 拥有了大脑,但手脚需要我们来提供, Cursor rules 扩展详细的参考:搏一搏,$20变$500:一小时魔改Cursor变身Devin

通过改造,可以让它执行前列出计划、积累自己的错误经验、使用工具等等。

比如我们写一个公司内访问 js Error 大盘的函数,并且在 Cursor rules 中告诉它怎么访问。然后直接问它昨天 xxx 页面的 jsError 情况怎么样,它就可以告诉我们了。

另外,Cursor 也支持 MCP(Model Context Protocol),是由 Anthropic(训练 Claude 的那个公司) 推出的开放标准协议,MCP 提供了一个统一的接口,使 AI 应用程序能够安全地访问和操作本地数据与服务,实现 AI 能力与本地资源的无缝连接。

目前已经有很多软件支持了,意味着 Cursor 通过 MCP 可以和很多软件进行交互。同样可以看看 awesome 项目:https://github.com/punkpeye/awesome-mcp-servers/tree/main。有一个前端相关的例子,Figma + Cursor:用 MCP Server 实现设计到代码的无缝转换

通过 Cursor rules 再结合各个 MCP,如果公司内部监控平台、埋点、数据查询等各个平台都支持了,内部所有系统打通,不敢想象它会有多强。

最后讲一个暴论:

编程范式正在经历一场革命:从面向过程到面向对象,再到函数式编程,现在我们迎来了面向 AI 编程的新时代。传统的编程语言(C++、Python、JavaScript、Java)可能会逐渐转变为类似汇编语言的角色——我们知道它的存在,但不再需要深入学习它。未来的主流编程方式将是使用自然语言。

windliang wechat