背景
Cursor是现在最流行的AI辅助编程工具之一,并且现在被探索出了越来越广泛的应用场景,比如近期有很多网友分享了"Cursor+Claude 3.7两步完成自动记账之类的APP开发"的实践。那么它的实际使用体验到底如何呢?复杂需求下表现是否依然亮眼呢?
一、Cursor简介
Cursor是基于VS Code的AI代码编辑器,核心特性包括:
- Agent模式:支持端到端完成任务,高效生成代码的同时允许开发者实时介入调整。
- 智能补全:根据上下文动态预测代码逻辑,自动提供多行补全建议。
- Chat模式 :
- 上下文交互:AI可实时查看当前文件与光标位置,支持针对性提问;
- 精准聚焦 :使用
Ctrl+Shift+L
或输入@.
将特定代码块加入对话上下文,实现局部问题诊断; - 全局分析 :通过
Ctrl+Enter
开启全库级对话,AI基于整个代码库解答复杂问题。
- AI代码交互 :
- 即时编辑 :选中代码段后按下
Ctrl K
,输入指令,AI将直接重写选中部分。 - 从零生成 :在未选中任何内容的情况下输入
Ctrl K
,描述需求,AI生成完整代码片段。 - 无缝衔接:编辑与生成过程无需切换界面,修改结果实时嵌入当前文件,支持多轮迭代调整。
- 即时编辑 :选中代码段后按下
二、收费模式
套餐类型 | 月度价格 | 年度价格 | 包含内容 |
---|---|---|---|
Hobby | 免费 | 免费 | Pro 版两周试用 2000 次补全 50 次慢速高级请求 |
Pro | 20 美元/月 | 16 美元/月 | 无限制补全 每月 500 次快速高级请求 无限制慢速高级请求 |
Business | 40 美元/用户/月 | 32美元/用户/月 | 包含Pro的全部功能 在整个组织强制启用隐私模式 集中式团队结算 带使用统计的管理员面板 SAML/OIDC 单点登录 |
限制请求次数,实际体验下来比限制token划算,token一下子就用完了......
三、安装和使用
官方中文文档:cursordocs.com/docs
3.1 下载和安装
直接在官网下载,按照提示安装即可,也可参考官方的安装指南。
3.2 功能和使用
官方中文文档对各功能都有非常详细的讲解,可直接查阅。这里只介绍界面和常用设置。
- 界面:与VS Code相似,多了右边栏作为AI功能区,用于输入指令和输出AI的生成结果
- Add context可以快捷使用@指令,如引用特定文件、代码段等
- 可以选择模式:
- Ask模式 对应了中文文档里的Chat模式,用于提问或解决问题;
- Edit模式 对应了中文文档里的Composer正常模式,提供代码探索和生成的核心功能,包括在代码库和文档中搜索、使用网络搜索、创建和编写文件、访问扩展的
@
-符号命令; - Agent模式 对应了中文文档里的Composer代理模式,获得一个主动与代码库协作的编码伙伴,可以自动提取相关上下文、运行终端命令、创建和修改文件、语义搜索代码、执行文件操作。
- 可以选择AI模型:
Claudde-3.5和Claude-3.7是当前AI编程领域最流行的模型。
对于需求梳理和文档输出,我觉得deepseek-r1使用体验不错。 - 除此之外还有一些其它按钮:
- Add context可以快捷使用@指令,如引用特定文件、代码段等
- Cursor设置:可以在首选项-Cursor Settings中进行设置
- 隐私模式开启后,不会被收集代码和提示词等隐私信息:
- 如果把yolo模式打开,运行命令或者进行文件操作时不需要二次确认。安全起见,也提供了一些禁止执行的命令的配置。
- 可以选择更多Cursor提供的模型,或者自己添加新的模型:
- 可以配置全局生效的规则,也可以在每个项目中配置项目的AI规则,并选择是否会被全局规则覆盖:
可以在 cursor.directory/ 中参考其他人写的规则。
- 隐私模式开启后,不会被收集代码和提示词等隐私信息:
四、案例和分析
4.1 案例一:简单自然语言指令
因为Cursor也有Agent模式,也能使用Claude 3.7模型,所以先试试同样的简单指令下Cursor和MGX的表现对比。
- 输入:
指令:
魔法学院学生需要依次通过所有选修学科的长老审核,并由授勋委员会授予勋章,方可毕业。每个学生至少选修了一个学科。学科为魔药学、占卜学、魔法史、炼金术。
做一个魔法学院毕业系统,作为毕业申请全流程管理平台,涵盖申请发起、多角色审核、状态流转、权限控制等功能。
模式:Agent
模型:Claude 3.7
- 耗时:约1小时
- 输出:后端部分和前端部分都会生成
- 主要页面的最终实现情况:没跑起来,调试几次之后觉得没有继续调试的意义。
- 报了各种各样的冲突和错误,并且在与AI沟通多次后依然反复出现同样的报错。
- 最离谱的是,刚开始它声称自己开发完了,一运行却报了路由引用错误,查看代码发现实际页面根本没做,都是空文件夹,指出这一点后AI才补充了所需要的页面文件。
4.2 案例二:经过AI优化且附带说明文档的指令
从场景一可以看出,同样是用一句话指令来完成有一定复杂度的需求,MGX由于有不同的智能体分工协作,最后还是能相对完整地实现一个Demo,但Cursor表现就不尽人意。由此看来,Cursor需要更加谨慎地使用指令。因此,接下来看看在有明确需求文档的情况下,Cursor的表现情况。
4.2.1 生成更好的提示词
为了避免无效请求,尽量得到更好的效果,我先与AI探讨怎样的提示词可以得到更好的效果。
- 输入:
指令:
魔法学院学生需要依次通过所有选修学科的长老审核,并由授勋委员会授予勋章,方可毕业。
文档内容是魔法学院毕业申请系统的主要流程,我希望使用指令实现这个流程的全部功能,并补充登录流程,完成魔法学院毕业申请系统,不需要添加其他扩展功能,即一共涉及4个页面:登录页、列表页、详情页、表单页(创建申请/编辑申请时)。
其中,登录流程仅需输入用户名和密码,角色根据用户记录在数据库(假数据)中。
请你给出合适的AI提示词,使我将其作为指令输入后,能够得到:
与说明文档功能流程一致并补充登录流程的产品文档,不要省略任何状态、按钮、表单和详情字段;
根据产品文档完成的交互友好界面美观的交互设计图,符合魔法学院的主题,且不额外加减功能(4个页面,每个角色每个状态都有示例数据);
根据产品文档完成的合理的系统设计;
按照产品文档、交互设计、系统设计实现的前端项目,使用Vue+TypeStript+Vite实现,代码风格良好,实现方式考虑到扩展性和后续维护方便,如按钮的复杂显示逻辑如何实现可以使代码兼具可读性和和可扩展性;
此外,由于不生成后端代码,前端实现时接口数据使用mock数据,也需要添加一些测试数据(假数据),包括不同状态(草稿、待审核、已完成等)的申请记录,用于实际验证。
现在请你给出合适的提示词,可以是需要分步执行的提示词,比如先输入这一段提示词可以生成PRD,然后输入下一段可以生成UI,等等。
模式:Ask
模型:Deepseek-r1
4.2.2 生成产品文档
- 输入:使用AI建议用来生成产品文档的提示词
指令:
基于《魔法学院毕业申请系统-说明文档》进行PRD扩展,要求:
- 新增登录流程:
- 登录页包含学院徽章LOGO、用户名/密码输入框、登录按钮
- 登录后根据角色跳转列表页
- 用户数据mock方案:包含5个测试账号(学生/导师/各学科长老/校长/授勋委员会各1个)
- 补充状态机细节:
- 每个状态转换需明确触发角色和条件
- 添加状态对应的界面元素变化规则
- 完善字段验证:
- 为每个表单字段添加详细的正则表达式规则
- 明确文件上传的格式限制(如PDF/Word/图片)
- 补充异常流程:
- 网络中断时的错误处理
- 并发操作冲突解决方案
输出格式:Markdown文档,包含修订记录和版本号模式:Ask
模型:Deepseek-r1
4.2.3 生成交互设计
- 输入:使用AI建议用来生成交互设计的提示词
指令:
根据PRD文档(产品文档.md)设计符合魔法学院主题的交互方案,以HTML文件形式输出,每个页面使用一个HTML文件。
要求:
- 设计系统包含4个核心页面:
- 登录页:融入魔法书卷动效
- 列表页:采用学院徽章配色(深蓝+金色)
- 表单页:设计为羊皮纸卷轴样式
- 详情页:采用魔法契约书视觉风格
- 为每个交互元素提供:
- 不同状态下的样式规范(正常/悬停/禁用)
- 移动端适配方案
- 动效设计说明(使用Vue Transition实现)
- 交付物要求:
- Figma线框图(包含所有角色视图)
- 交互状态流程图(用Mermaid语法表示)
- 视觉规范文档(字体/色值/间距系统)
设计视觉规范遵守文档:xxx模式:Edit
模型:Claude 3.7(经过网友测评,Claude 3.7对于交互设计有优秀的表现)
- 输出:检查效果并调整后,主要页面设计图如下所示
可以看到,在同一个会话里,几个页面的总体风格还是能基本保持一致的。
中途由于网络原因无法输出结果,重新开了一个会话之后无论怎么调整提示词,AI都无法做到在新会话里保持与原会话风格一致,包括输入同样的提示词并要求与已生成的页面保持一致风格、上传生成好的其他页面的截图并要求与此图风格一致等。还好后来原会话的连接恢复了。
4.4.4 生成系统设计
- 输入:使用AI建议用来生成系统设计的提示词
指令:
根据PRD文档设计符合Vue3最佳实践的技术方案,要求:
- 前端架构:
- 模块划分:auth(认证)、application(申请)、review(审核)、shared(公共)
- 状态管理:使用Pinia设计Store结构,包含:
- authStore:管理登录状态和角色
- applicationStore:管理申请数据流
- reviewStore:处理审核逻辑
- 核心实现方案:
- 动态路由配置方案(根据角色显示不同导航)
- 复杂按钮权限的实现策略(基于角色和状态的条件组合)
- 表单验证的统一封装方案
- 文件上传组件的断点续传实现
- Mock方案:
- 使用MSW实现API Mock
- 测试数据包含10条不同状态的申请记录
- 错误案例数据(用于测试异常流程)
- 需要包含接口规范
输出:系统设计文档(含架构图+核心模块流程图)
输出格式:一份完整的markdown文档,不要生成过多图片或太大的图片模式:Ask
模型:Deepseek-r1
4.2.5 生成前端代码
- 输入:使用AI建议用来生成前端代码的提示词
实际使用时发现AI执行命令时哪怕报错了它也会认为执行成功了,所以加了一句命令由我亲自执行
指令:
基于以上产品文档、系统设计文档、各页面交互设计图,实现Vue3项目,要求:
- 技术栈:
- Vue3 + TypeScript + Vite
- Element Plus表格组件 + HeadlessUI交互组件
- 使用VueUse实现复杂交互逻辑
- 代码规范:(完整规范参考文档)
- 按钮权限逻辑通过组合式函数实现(示例):
typescript// features/application/useApplicationActions.ts export function useApplicationActions(role: Role, status: ApplicationStatus) { const visibleActions = computed(() => { return ACTION_RULES[role].filter(rule => rule.visibleStates.includes(status) ) }) }
- 关键实现要求:
- 状态机使用XState实现
- 表格实现虚拟滚动
- 使用Suspense处理异步加载
- 交付内容:
- 完整Vite项目结构
- 包含所有类型定义(.d.ts)
- 配置好Prettier+ESLint
- 附带README.md(含测试账号和启动说明)
注意,Windows终端不支持&&操作符,不要使用&&
首先,请按顺序一次性输出正式开发前需要执行的所有命令,比如创建项目、安装依赖等,以可复制文本的形式输出,我自己打开终端执行,不在聊天窗口执行
模式:Agent
模型:Claude 3.7
将AI列出的需要执行的命令都执行完成后,再让它继续开发
- 另外,提这个需求,主要目的依然是看看AI面对这种按钮权限比较复杂的情况会怎么处理,看起来它可以想到要怎么做更好,但实际做的时候会忘记
- AI生成的输入指令的代码规范里使用一个方法,通过传入的角色和状态进行判断:
- 但在实际代码中,AI没有遵守传入的代码规范文件,而是每个按钮分别写了不同的方法来判断:
- AI生成的输入指令的代码规范里使用一个方法,通过传入的角色和状态进行判断:
4.2.6 主要页面实现情况
- 第一次完成时
- 登录页:样式与交互设计稿有点偏差,但总体满足要求
- 列表页:PRD里要求了5个筛选框,实际只实现了2个;列表页的列与PRD的要求也不一致,多了申请标题,少了选修专业;操作列的按钮没有展示出来;列表UI实现与设计稿偏差较大,但背景是统一的
- 详情页:实现的字段和PRD要求完全不一致;除了背景一致之外,其他UI实现也与偏差较大
- 表单页:实现的字段和PRD要求完全不一致;除了背景一致之外,其他UI实现也与偏差较大
- 登录页:样式与交互设计稿有点偏差,但总体满足要求
- 多次调整细节后
为了防止AI再次遗忘需求,我将差异点分成多次指令一点一点调整AI的实现结果。但是很遗憾,没有调整完成,免费试用的额度就用完了。
最后的半成品效果如下所示:- 列表页:按照要求添加了筛选框和按钮的实现
- 详情页:字段与PRD要求一致
- 表单页:字段基本与PRD要求一致
- 列表页:按照要求添加了筛选框和按钮的实现
- 耗时:没有分别记录每个步骤的耗时,直到最后免费额度用完,总体耗时不到1天。
- 总结:使用详尽的分步指令时,虽然最后实现结果与预期不完全一致,但也已经是个合格的demo。
五、优缺点深度分析
- 优点
- 代码补全功能非常智能,减少重复编码工作量,提升开发效率
- 对于没有复杂后端逻辑的简单前端应用表现不错,比如社区分享的大量案例(如自动记账等)
- 通过优化提示词(如分步拆解需求、提供方案参考),可生成具备核心功能的Demo(如本文案例二)
- 缺点
- Cursor有时也无法修复bug,依然需要开发者有定位和修复bug的能力
- 即使提供了完整的产品文档、技术方案、交互设计,仍会出现字段缺失、功能偏离、样式偏差等问题,推测与上下文长度有关,长文档的关键细节可能容易被AI忽略
- AI的结果输出不稳定,相同提示词在不同会话中生成的结果可能差异较大,此外中途切换会话会导致逻辑断层
- 聊天框内执行命令时,AI可能忽略关键报错信息(如版本冲突提示),仍需要手动在终端执行
六、总结
总体来说,Cursor作为一款AI辅助工具,在特定场景下能有效提升开发效率。结合试用经验,以下是一些应用建议:
- 先通过Chat模式明确需求,获取AI的技术建议(如提示词优化、模块拆分方案、代码修改建议),人工判断合理性之后再用Edit/Agent生成代码
- 比如本文案例二里,先根据AI的建议优化提示词,然后依次生成产品文档、交互设计、系统设计等,最后再参考各个文档生成代码
- 尽可能将复杂需求拆解为明确独立的小任务,按阶段生成并验证代码
- 复盘本文案例二时发现,应该先让AI按照所提供的产品文档、交互设计、系统设计依次实现每个页面的功能,每个页面的功能验收通过了再继续下一步,这样应该能改善字段缺失、功能偏离、样式偏差等问题,得到更好的效果,可惜免费额度已经用完了
AI目前还是一个不可控的黑盒,使用AI需要反复试错。如何优化提示词、如何更好地拆解任务、如何更好地发挥AI的潜力,都需要多次尝试、及时复盘,并不是什么都交给AI就可以高枕无忧了。AI发展势不可挡,我们也要持续学习,把握主动权,不能落后于时代。