cursor 使用技巧

一、创建项目前期步骤

1.先给AI设定一个对应项目经理角色，

2.然后跟AI沟通项目功能，生成功能设计文件：README.md

README.md=项目功能

3.再让AI总结写出开发项目规则文件： .cursorrules

是技术栈进行限定，比如使用什么框架、什么语言等限制

二、cursor功能技巧

2.1 @Codebase功能：

是 Cursor 中的一个功能，它允许你将整个代码库（Codebase）与 AI 进行交互。通过 @Codebase，AI 可以理解你项目的上下文，并根据整个代码库的内容来回答问题、生成代码或提供建议。这个功能特别适合在大型项目中，AI 需要了解全局上下文才能给出准确的建议。

聊天框中输入 @Codebase，然后提出你的问题或需求。

通俗易懂的例子

假设你正在开发一个电商网站，代码库中有以下文件：

product.py：定义了商品类（Product）和相关方法。
cart.py：定义了购物车类（Cart）和相关方法。
user.py：定义了用户类（User）和相关方法。

现在，你想实现一个功能：“当用户将商品添加到购物车时，检查库存并更新库存数量”。

没有 `@Codebase` 的情况

如果你直接问 AI：“如何实现这个功能？”，AI 可能会生成一个通用的代码片段，但它不知道你的代码库中已经定义了 Product、Cart 和 User 类，也不知道它们的属性和方法。因此，生成的代码可能不够准确，甚至需要你手动调整。

使用 `@Codebase` 的情况

你可以这样问 AI：

复制

@Codebase 如何实现当用户将商品添加到购物车时，检查库存并更新库存数量？

AI 会分析你的整个代码库，发现 Product 类中有一个 stock 属性，Cart 类中有一个 add_product 方法。然后，AI 会根据这些信息生成一个与你的代码库完全兼容的实现

2.1.1. 明确项目上下文

在对话开始时，明确告诉 AI 项目的背景、技术栈、代码风格和架构。例如：

技术栈：Python + Flask，使用 SQLAlchemy 作为 ORM。
代码风格：遵循 PEP 8，使用类型注解。
架构：采用 MVC 模式，代码分为 models、views 和 controllers 目录。

示例对话：

@Codebase 这是一个 Flask 项目，使用 SQLAlchemy 作为 ORM，代码风格遵循 PEP 8。请帮我生成一个用户注册功能的代码。

2.1.2. 使用 `@Codebase` 保持上下文

每次对话时，尽量使用 @Codebase，让 AI 始终基于你的整个代码库进行回答。这样可以避免 AI 生成与现有代码冲突或不一致的代码。

示例对话：

@Codebase 请帮我优化这个函数，确保它与现有的代码风格一致。

2.1.3. 分模块对话

将项目分解为模块或功能点，每次对话专注于一个模块。例如：

先完成用户认证模块。
然后完成商品管理模块。
最后完成订单处理模块。

示例对话：

@Codebase 我们现在专注于用户认证模块。请帮我实现用户登录功能。

2.1.4. 定期检查生成的代码

AI 生成的代码可能不完全符合你的需求，因此需要定期检查并调整：

代码风格：确保生成的代码符合项目的代码风格（如缩进、命名规范等）。
逻辑一致性：检查生成的代码是否与项目的业务逻辑一致。
性能优化：确保生成的代码没有性能问题。

示例对话：

@Codebase 请检查这段代码是否符合项目的代码风格，并优化它的性能。

2.1.5. 使用版本控制（Git）

在开发过程中，定期提交代码到 Git，并添加清晰的提交信息。这样可以在出现问题时快速回滚，同时也能记录项目的演进过程。

示例操作：

git add .
git commit -m "feat: 实现用户注册功能"
git push origin main

2.1.6. 统一命名规范

在对话中明确命名规范，并让 AI 遵循。例如：

变量名使用小写字母和下划线（user_name）。
类名使用驼峰命名法（UserController）。
常量名使用大写字母和下划线（MAX_USERS）。

示例对话：

@Codebase 请生成一个函数，命名为 `get_user_by_id`，参数命名为 `user_id`。

2.1.7. 定期重构代码

随着项目的发展，定期重构代码以保持一致性。可以让 AI 帮助你识别需要重构的部分。

示例对话：

@Codebase 请检查整个项目的代码，找出需要重构的部分，并提供重构建议。

三、沟通技巧

复制

请设计一个用户友好的注册页面，确保输入框和按钮的尺寸适中，适合移动端和桌面端。

3.2、生成不适合自己的界面时，如何调整提示语？

如果 AI 生成的界面不符合你的预期，可以通过以下方式调整提示语：

1. 指出具体问题

明确告诉 AI 哪里不符合你的需求。

示例：

复制

颜色太暗了，请改为明亮的浅色背景，并增加一些渐变色。

2. 提供更具体的需求

补充更多细节，帮助 AI 更好地理解你的需求。

示例：

复制

请将导航栏改为固定在顶部，商品展示区的卡片间距加大，按钮改为圆角设计。

3. 调整风格或布局

如果风格或布局不符合预期，可以明确要求调整。

示例：

复制

请将布局从网格布局改为瀑布流布局，风格从简约改为复古。

4. 增加或删除元素

告诉 AI 需要增加或删除哪些元素。

示例：

复制

请删除顶部的横幅广告，增加一个搜索框，并将登录按钮移到右上角。

5. 提供参考图

如果文字描述不够直观，可以提供参考图或描述参考图的特点。

示例：

复制

请参考这张图的设计风格（附上图片链接），但将主色调改为蓝色。

3.3、示例对话

第一次生成

你的提示语：

复制

请设计一个现代风格的登录页面，包含用户名、密码输入框和登录按钮。

AI 生成的界面：

背景为深灰色，输入框为黑色，按钮为红色。

调整提示语

你的反馈：

复制

颜色太暗了，请改为明亮的浅色背景，输入框和按钮使用蓝色，整体风格保持现代感。

AI 重新生成的界面：

背景为白色，输入框为浅蓝色，按钮为深蓝色。

进一步调整

你的反馈：

复制

请将按钮改为圆角设计，输入框增加阴影效果，并在页面顶部添加一个 Logo。

AI 最终生成的界面：

背景为白色，输入框为浅蓝色并带有阴影，按钮为深蓝色圆角设计，顶部有一个 Logo。

3.4、总结

写提示语的技巧

明确界面类型。
描述风格和主题。
指定布局和组件。
提供参考或灵感。
强调用户体验。

调整提示语的技巧

指出具体问题。
提供更具体的需求。
调整风格或布局。
增加或删除元素。
提供参考图。

三、实用技巧

1.从一开始就写Readme：在创建项目时，让Cursor生成详细的Readme文件，明确项目目标和功能。
2.代码注释：要求Cursor在生成代码时自动添加清晰的注释，提升代码的可读性。
3.让cursor复述你的要求
4.善用图示提问
5.给建议而不是给命令

除非你非常确定自己想要用什么方案，否则会更建议和cursor沟通时多问这个方案怎么样，并从中寻找最佳方案，而不是选择用下命令的方式，直接堵住了其它可能。

cursor（或者说ai）的优势在于懂的多，而我们人类的优势在于拥有独特的经验，以及更了解自己当下的资源约束。所以在前期需求沟通阶段，可以充分发挥ai的优势，等明确需求后，就可以约束cursor进行更高效的开发了。

当然，大家不用背诵这些需求沟通的技巧，因为基本可以用下面这段prompt实现：

#角色设定
你是一位经验丰富的项目经理，对于用户每一次提出的问题，都不急于编写代码，更多是通过深思熟虑、结构化的推理以产生高质量的回答，探索更多的可能方案，并从中寻找最佳方案你具备以下能力：#需求澄清
1.能用自己的话清晰地复述用户提出的问题
2.与用户建立高层级需求沟通
3.提供类比案例帮助用户启发思考
4.使用问题链追问来深入用户潜在需求
5.解释主要挑战和限制条件
6.整个思考过程，你可用提问的方式，补全你需要的资料和信息#方案探索
1.基于已有技术，探索多种可行的实现方式
2.列出每种方案的优点、缺点、适用场景及成本
3.优先考虑网络中已有的技术解决方案，避免重复造轮子
4.根据需求提供最优推荐，说明推荐理由及后续改进方向#执行计划
1.基于推荐方案，制定系统架构、数据流及交互
2.使用敏捷方式管理，制定迭代方案
3.明确每次迭代的目标及任务明细

对话效果如下图所示（我把prompt放在了Rules for AI里）：

6.Chat和Composer搭配使用

cursor有Chat和Composer两种模式，我的方法是一般就是先用Chat模式和cursor沟通好整体的产品架构、技术栈等细节，形成相对成熟的方案后再放到Ccomposer模式去沟通，这样效率更高。这是因为两者的侧重点不同：

Chat模式：主要用于和cursor对话，你可以问它有关代码的问题，获取即时的反馈和建议。

Composer模式：更侧重于代码的撰写和编辑，你可以在这个模式下进行长篇代码的编写、更改。区别于Chat，Composer生成的代码是会帮你直接弄到文件里了，不用复制粘贴。

7.部分限定提问

因为LLM具有随机性和上下文限制，所以每次提问cursor，它给出的下一步方案都可能和前面存在偏差（也就是它可能会删改以前的代码，甚至把原有的必要功能改没了），进而导致报错。

为了减少这种情况，可以每次提问会加上一句：

尽量不大改代码框架的前提下，给出最合适的代码方案

或者

我想增加某某功能，你需要注意的是：保证原有功能代码正常运行，不能把原来的功能改没了

这些限定提问没有严格的prompt，只要能让cursor理解就行。

为了避免上下文限制，我还会阶段性地把最新代码给cursor进行检查，比如之前的检查过程中，cursor就找到了一些重复代码，以及提供一些更全面的方案（比本地没有这个字体的话，可以替换成另一种可用字体，避免出现显示问题）

8.输出日志

在cursor运行代码的过程中遇到bug，是我们做项目几乎无法避免的，为了帮助我们更好地定位和解决问题，可以这么给cursor提出要求：

在【某功能】的执行过程中，输出关键日志信息

9.先 save 再 accept

最后：cursor开发项目常见卡点

这里主要整理了航海项目一些常见卡点，方便大家快速找到解决思路：

卡点1：Python版本与pip指令不一致

适用项目范围：

使用 Pygame 等库开发简单的游戏（比如这次航海的俄罗斯方块）
使用 Pillow 和 OpenCV 进行图像处理和计算机视觉任务（比如批量剪辑视频）
使用库如 Pandas、NumPy 和 SciPy 进行数据处理和分析（比如爬虫和数据分析）
使用 Flask、Django 和 FastAPI 等框架构建 Web 应用程序
使用 TensorFlow、Keras、PyTorch 和 Scikit-learn 等库进行模型训练和预测

cursor不会直接根据你的设备，以及你安装的Python版本给出对应的终端指令，所以有时候我们会遇到这么一种情况就是，即使根据cursor给出的pip指令运行但依然报错。这一般就是pip指令和Python安装版本不一致的问题。

所以我们需要理解Python安装版本与pip指令的基本关系，才能在后续减少这种问题的发生（其实我就是为了减少fast requests的无效消耗）

1）pip指令与你最初安装的Python版本有关。如果你最初安装的是Python 3.x，通常使用pip3来安装库，以确保您安装的是与Python 3.x兼容的库。如果最初安装的是Python 2.x，则使用pip来安装库实现兼容。如果不兼容，运行终端指令时就会经常报错。

2）如果同时安装了Python 2.x和Python 3.x，在这种情况下，一般需要使用pip和pip3来分别管理不同版本的库。为了避免库版本冲突，也可以在虚拟环境中安装库

3）Cursor并不会主动帮你判断你是否安装了Python，以及安装的Python是哪个版本，但你可以这么操作进行查询：

第一步（确认是否安装Python）：打开终端，输入指令，python3 --version 或者 python --version，这一步就可以确定你是哪个版本
第二步（确认是否安装pip）：根据你前面得到的版本信息，如果是3.x，就使用指令 pip3 --version，如果是2.x，就是用指令pip --version，如果你看到pip的版本号，说明pip已安装。
第三步（检查已安装的库）：指令pip3 list或pip list，这将列出所有已安装的Python库及其版本。你可以在列表中查找本次项目所需要安装的库。如果没有，就进入第四步。
第四步（安装缺少的库）：如果你发现某个库（比如 pandas）未安装，可以使用以下命令安装它们：pip3 install pandas或者pip install pandas。

安装完成后，你可以再次运行pip3 list或者pip list命令，确认这些库是否已成功安装。

卡点2：找网页页面标签

适用项目范围：各种社媒、网页相关内容的爬取

如果你想抓取特定网站的内容，以小红书的页面标签获取为例（操作同样适合其他社媒、网页）：

在小红书笔记的空白处点击鼠标右键，Mac电脑选择最底部的“检查”（Win电脑印象中是“检查代码”，也可以按F12），然后就会唤起一个叫“开发者工具”（Developer Tools）的窗口。

在大多数现代浏览器中，包括Chrome、Firefox、Safari等，都内置了开发者工具，以便开发者检查和调试网页的HTML、CSS和JavaScript代码（做过SEO的小伙伴对这块应该会很熟悉）。

首次接触的小伙伴也不用担心，如果你打开的“开发者工具”显示英文（首次打开应该都是英文），直接在窗口上方找到并选择“Elements”选项（如果中文界面的话就找到“元素”选项，你不用看这里面的代码，直接Ctrl+F，在唤起的搜索窗口中输入“detail-title”或者“detail-desc”，然后你就能快速定位到这篇笔记在代码中的标题和描述，而标签，就在这串标题和描述代码的下方，对应的字段名是“hash-tag”。

如果定位到“detail-desc”还没有找到“hash-tag”，其实就是因为代码行被折叠了，你点击那个向右的三角形，当它变成向下你就可以找到“hash-tag”了。

卡点3：找页面 cookies

适用项目范围：各种社媒、网页相关内容的爬取（尤其是需要登录要登录才能查看或下载的内容）

同样以小红书为例，如果你将找cookies的问题抛给cursor，但你又没能描述清楚你的目的，那你可能就会获得两种找小红书cookie的方法，一种是航海手册里提到的“开发者工具-Network（网络）选项卡”，一种是“开发者工具-Application（应用）选项卡”。

千万别选后者去找cookie，因为它们展示的信息和用途有所不同：

"Application" 选项卡下的 "Storage" 部分显示的是当前域名下存储的所有 cookies。在这里，你可以查看每个 cookie 的名称、值、域、路径、到期时间、大小、HTTP 标志（如 HttpOnly 和 Secure）以及 SameSite 属性。你还可以在这里直接对 cookies 进行增删改查操作，例如添加新的 cookie、编辑现有 cookie 的值或删除某个cookie。

"Network" 选项卡显示的是每个网络请求的详细信息，包括请求头（也就是这一次需要到的 "Request Headers" ）、响应头、查询参数等。在 "Request Headers" 标签下，你可以看到特定请求中实际发送到服务器的 cookies。这里展示的 cookies 是当前请求中浏览器自动附加到请求头中的，你可以看到 cookies 的实际发送情况。不过你不能直接在 "Network" 面板中编辑 cookies，因为它主要用于查看和分析。

那在"Network" 选项卡中怎么快速找到这次开发项目需要到的cookies呢？

大家打开“开发者工具-Network（网络）选项卡”，然后刷新一下你当前打开的小红书页面，这个时候你就会发现Network（网络）选项卡下的“Name”会刷新很多条记录，其中位于最上方的记录（一般是蓝色icon，如果担心找错，可以查看它的文件名，是对应着这条小红书笔记在域名后的那串URL，如下图所示）

选中这条记录后，在右侧面板的“Headers”拉到下面的“Request Headers”找到“Cookie”，然后复制粘贴进cursor给你生成的.py文件中的对应位置。

卡点4：重复加载已解压的拓展程序

适用项目范围：浏览器插件开发

我之前在做网页复制浏览器插件，因为完全不懂浏览器插件的开发，所以每次代码更新就重复进行“加载已解压的拓展程序”的动作，非常低效。后面我才了解到开发者模式下的手动更新和已经发布后的更新是不一样的：

开发者模式下的手动更新：在开发者模式下，开发者可以加载解压缩的扩展程序进行测试。在这种情况下，开发者可以手动更新代码（直接点那个“刷新”icon即可），并通过浏览器扩展页面的“重新加载”按钮来应用更改。但这仅限于开发和测试阶段，不适用于已发布的插件。
已发布的插件的更新：一旦插件被提交到浏览器的扩展商店，更新过程就由商店控制。如果开发者想更新代码并且让用户使用上新版本，开发者需要提交新版本，审核通过后用户端的插件通常就会自动更新，因为大多数现代浏览器，如Chrome和Firefox，都为插件和扩展提供了自动更新机制。这意味着一旦插件的新版本在商店中发布，并且用户的浏览器配置为自动更新，插件将自动更新到最新版本，无需用户干预，除非用户关闭了自动更新。

总结来说，开发者在开发阶段可以通过开发者模式手动更新和测试插件，但这种手动更新方法不适用于用户端的已发布插件。

卡点5：错误地将初始创建的完整项目文件夹进行“拓展程序的加载”

适用项目范围：浏览器插件开发

不同于此前的浏览器插件项目，这次的金句卡片生成插件不是将初始创建的项目文件夹进行“拓展程序的加载”，而是将这个项目内生成的dist文件夹进行加载。

注：cursor通常会创建命名为dist。当然，每个人情况可能还不太一样，不过很容易辨别。因为项目根目录下的文件夹就几个，包括自动生成的src、node_modules，以及我们自己创建的public，后者是用来放各种icon的。

如果你将项目文件夹进行加载，一般会遇到这样的报错：

“未能成功加载扩展程序文件
~/文稿/cursor开发文件/highlight-card
错误
无法加载背景脚本“background.js”。
无法加载清单。”

这个错误提示表明背景脚本 background.js 无法加载。我们需要检查以下几个方面:

文件路径: 确保 background.js 文件存在于 src 目录下，并且在 vite.config.js 中的路径配置正确。（经过几轮排查，这个通常是没有问题的）
清单文件: 确保 manifest.json 中的 background 字段正确指向 background.js。（经过几轮排查，这个通常也是没有问题的）
构建输出: 确保在构建时，background.js 被正确打包到 dist 目录中。
Chrome扩展管理: 确保在Chrome扩展管理页面加载的是构建后的 dist 目录，而不是源代码目录。

真正的问题其实就是出在3和4。定位到问题，其实解决起来就不难了，针对3和4的问题去提问cursor然后根据它的引导就可以解决。

卡点6：终端生成文件与实际运行文件不符

适用项目范围：涉及终端指令新建文件夹的开发项目

初学cursor的小伙伴，大概率会在开发项目里遇到需要新建文件夹（用于存放特定文件）的情况，有时候cursor会给出指令让大家新建文件夹，但如果我们不清楚项目文件结构，以及代码指令，很容易出现明明按照指令新建文件夹了，但最后就是运行失败。

这么说可能有点抽象，给大家举个我在航海项目中的实际例子，方便大家理解：

之前在AI恋爱项目开发过程中，我按照cursor指令做完所有流程，但在运行项目后打开本地的测试链接（一般是 http://localhost:3000），每次显示都是NEXT.js的欢迎页面，即使中间让cursor提供了其它技术方案也还是一样。当时我经历了几轮排查：第一轮解决方案：我对旧项目进行了删除，然后重新一步步来，但后面还是陷入了死循环（失败告终）；第二轮解决方案：我还是对旧项目进行了删除，然后重新引导，中间还是陷入了和之前一样的死循环，及时把每次的报错都给了cursor，cursor依然无法定位到问题所以。这种情况下，我对cursor提出跳出这个技术栈的限制，换个思路重新找解决方案，后面它就提供了一种每次都在终端上运行的执行。这种指令的确解决了测试页面一直不生效显示的问题，但带来了一个新问题，就是每个功能增删甚至是样式调整，都只能复制粘贴到终端，然后再运行，整个效率非常低，这不是cursor开发应用应有的流程，肯定是有问题的（失败告终）；这时候我知道不能死磕在这上面，所以把问题留给到今天早上（一直解同一个bug却始终不成功真的很磨人，所以建议大家遇到类似的bug可以先放一放，无论是做其它项目，还是看个视频吃个东西还是睡觉放松真的很必要）第三轮解决方案：把旧项目删的干干净净，重新来。但这一次不同的是，我每一小步都让cursor进行详细的描述，解决一小步再让cursor推进下一步，这样我就能更好地控制变量以便排查定位bug（cursor一次性生成多个代码文件确实是它的有点，这也导致了问题定位往往不太方便）。正因为这一步的调整，我在推进代码运行前期发现了一个很小但很致命的问题（这个昨天我完全忽略了），就是我一开始创建了一个中文命名的文件夹，然后用cursor打开，这在之前的俄罗斯方块应用和图片压缩工具站都没有遇到问题，但放在AI恋爱测试站上，这个问题很致命。因为文件少，所以当我去打开这个项目文件的时候，发现一个问题，有两个page.tsx文件，分别在这个项目里的不同路径中，两个文件刚好不一致。所以我就问了cursor一个问题：”你帮我创建的page.tsx的文件，在cursor编辑器里打开，和在vscode编辑器里打开，显示的内容是完全不同的？怎么才能做到两边是同步的？“然后cursor终于醒悟了，给出回复：“让我们一步步解决这个问题：
首先，让我们确认文件路径。在终端中运行：pwd
确保我们在 /Users//Documents/cursor开发文件/婚恋/love-mathc 目录下然后，让我们修改文件内容，确保两边都能正确显示：在保存文件后：
关闭 Cursor 和 VSCode 中的文件
重新打开这两个编辑器
重新打开文件如果还是不同步，请告诉我：
Cursor 中显示的具体内容
VSCode 中显示的具体内容
文件的具体路径（在两个编辑器中都检查一下）这样我可以帮你找出问题所在。”至此，终于定位到问题了。简单梳理下，具体是这样的：当我们打开这个中文命名的文件夹（为方便理解，这里的中文名文件夹就叫做 恋爱测试，下同）后，按照cursor的步骤正常推进，它会创建一个page.tsx的文件，这个文件的路径是/Users/username/Documents/cursor开发文件/婚恋/src/app/page.tsx，这个文件是实时创建并在cursor编辑器中打开，文件里的内容就是你最新页面的代码，但这个文件并不是被实际调用的文件。如果不熟悉指令，你还会在这个过程中稀里糊涂地根据cursor的指引，在原本的”婚恋“文件夹下创建出

参考：

https://zhuanlan.zhihu.com/p/14690060398