Cursor编程实战技巧

135 阅读6分钟

已经使用Cursor来辅助编程也有一段时间了, 尝试用Cursor从0编写代码,也尝试在现有项目上进行扩写,下面就是我在使用Cursor时的一些感悟

强大的@功能

在Cursor中最让我觉得好用的点在于他的@功能, 下面我列举两个我最常用的功能用来说明

  • 通过@Docs的方式可以添加文档, 我尝试使用该功能去添加appCharge的使用文档, 并向他提问,获得执行的具体步骤

  • @File圈定上下文, 通过对文件的引用,能很清晰的告诉Cursor具体参考哪个文件, 在哪个文件中进行扩写等等

  • @Web 搜索功能, 这个比单纯的去搜索引擎search效果更好,例如 image.png 在这个例子中,我引用了一段代码,并使用@Web的形式让他帮我做一下代码的解释, 下面他列出了一些查找的链接, 最后进行内容汇总,AI在帮我们输出出来,做了详尽的解释

结构化输入Notepads

我一直在使用Notepads功能, 我看了很多介绍Cursor的视频和文章都只是对Notepads一笔带过,但我觉得这个功能很强大, 是结构化输入的一种重要方式, 我们可以用markdown的形式详细的告诉Cursor我们的目的,我们的需求等等, 同时Notepads还能保留下来,方便我们以后进行查看和复盘. 我尝试过 一个Notepads记录代码片段,另外一个Notepads写需求,然后让需求去参考代码片段去实现新的代码,效果也是很不错的

下面是使用Notepads的一个例子

  • 告诉它的一些前提和必要阅读的代码文件, 我用必要说明的方式告诉他了
  • 下面就是我提的具体需求,写的很详尽
### 必要说明
本项目的管理后台,使用express框架实现,
 @AdminRouter.js 是路由文件
 @AdminApi.js 路由对应的逻辑处理文件
 @index.blade 是菜单使用的模板引擎文件
 @nav.js 菜单对应的JS代码
 @mytable.blade 内容的模板引擎

### 获得已开启的活动
1. 仿照 @AdminRouter.js中 `getactivitygrouptime`的路由,帮我写一个`getopenactivitygrouptime`的路由,要求这个路由返回的是已经开启的活动列表 (开始时间字段: startTime,结束时间的字段: stopTime, 时间格式是: `2017-08-25T09:00:00.000Z`); 结果按照结束时间从小到到排
2. 在 @index.blade中加上对应的点击按钮, 可参考 @index.blade文件中的`getactivitygrouptime`写法
3. 在 @nav.js中添加对应的点击事件,参考 `#get_activity_group_time`的点击事件


### 直接在活动列表中设置活动状态
1. 仿照 @mytable.blade 创建一个新的模板引擎名字叫: `activityTable.blade`,它是活动列表专用的,和 @mytable.blade不同的点在于,它每一行的活动都包含管理能力, 这些管理能力包含: 开启活动(UI上应有一个输入框,表示开启活动的分钟数,如果活动是开启的,按钮状态为disabled) 关闭活动(如果活动是关闭的,按钮状态为disabled)
2. 在 @nav.js中绑定这些操作按钮的JS事件,
3. 在 @AdminRouter.js中实现开启/关闭活动的路由
4. 在 @AdminApi.js 中实现这些开启/关闭活动逻辑, 开启活动: 修改开启时间和结束时间,开始时间是当前时间的前5分钟,结束时间是当前时间加上UI输入框中输入的分钟数,关闭活动: 修改开启时间和结束时间为一个过去的时间即可, 无论是开启活动还是结束活动都调用 @AdminApi.js中的setActivityGroupsTime函数,需要注意的是: 调用函数的disablePlatformsStr, needIapRangeStr两个参数都需要从UI上传进来
5. 修改 @AdminRouter.js 中的`getactivitygrouptime`路由和 `getopenactivitygrouptime`渲染模板为`activityTable.blade`,让这两个列表有活动管理的功能
6. 在玩家修改活动状态后,我想立即看到修改后的效果

在完成这个需求后,我可以通过Notepads进行复盘,看看我和Cursor的沟通,有哪些是好的,有哪些是不好的,如何改进我的提示词等

清晰的去表达你的需求

我们可以把AI理解成我们的一个助手, 在编程的领域我们可以把AI看成是一个我们带的一个实习生,可以帮我们做各种事情,我们在给他布置任务的时候一定要详尽的告诉他我们的需求,他可以参考的对象等等,不要让他去猜,这种猜出来的结果往往是不好的. 还是以我上面Notepads的例子来说明, 我在给他布置任务的时候会先告诉他我们项目的一些基本的情况, 比如使用express实现的,路由文件是哪个,svc文件是哪个等等 在然后的具体需求中我也很详细的告诉他执行的步骤

更加重视需求而非代码实现

现在Cursor能帮我实现代码了, 程序员的工作就前移了,整理需求, 如何描述需求让Cursor能理解, 如何描述需求让Cursor能和代码关联起来,这成了程序员们首要应该考虑的问题了,我们做程序的有一个思维固化,上来就想着代码, 现在有了AI,我们必须打破这个思想固化,更应该考虑怎么拆解需求,怎么把需求变成函数,又怎么把这些函数串联起来,而具体的实现,AI参考我们的需求和代码片段就能比较完整的实现出来了

他能做的是你能做的

这话有点绕口了,大概是什么意思呢, 你的AI能准确的反应出你的水平, 你能想到的描述给AI他就能帮你实现, 你想不到的边界条件,AI也不会额外的帮你实现,所以还是需要提供我们自己的业务水平.我们的描述画面感越强,AI实现出来的结果就越好.

Cursor上传图片

我们在描述UI的一些问题的时候,不知道怎么通过语言的方式去和Cursor沟通的时候,我们可以通过上传图片的方式去描述,下面是我实际工作中的一个小例子 我想把这个框拉长一点,有于是我就截了个图并保存了下来 然后通过Cursor的上传图片的功能,并且告诉他, 我想要这个输入框更长一些 修改后确实变成了.

使用mermaidchart实现流程图

当我们用文字来描述流程的时候,其实是很费劲的,不如画图来的实际, 上面介绍了上传图片的方式,但在Notepads中没办法直接上传,那么我们可以使用mermaidchart来生成流程图代码的方式 我们编辑右边的图形化,把左边的代码Copy到Notepads中,Cursor在执行时也能明白我们流程,使用起来很舒服

结语

以上就是我使用Cursor的一点点小的感悟吧, 我还会继续更深入的使用,还有一些问题还未解决, 比如: 我觉得描述虽然清晰,但还是有点太多了,如何更省时省力的描述清楚呢?