官方指南！Cursor “日产十亿代码”：大型项目 + Web 开发 (MCP) 实战！

Cursor 老大扔了个话：AI 每天生成 10 亿行被接受的代码，人类世界一天也就写那么几十亿行。

还给了目前最受欢迎的模型和使用频率增长最快的模型 

社区：“牛”、“软件行业的改变”、“对新手简直福音”。

有人已经开始畅想未来：程序员角色会更像架构师+QA，整个市场都被激活了。

瓶颈要从写代码变成审代码了 (Amdahl 定律 yyds)。求 Cursor 加个编辑历史上下文，让 AI 更好地审 PR。

说到怎么用好 Cursor，特别是应付复杂的代码。

Cursor 官方专门发了篇博客，讲怎么“驯服”大型项目。以及一篇Web开发的博客。如果你经常看本公众号文章，可能对下面提到的一些技巧已经比较熟悉了。甚至用到的MCP都不谋而合。

那么我们先来讲讲。官方说的Cursor + 大项目实践方式：

搞大型项目，遇到的坑跟小项目完全不是一个量级。Cursor 这帮人，一边死磕自家代码库，一边跟那些管着 “巨型项目” 的客户取经，总结出了一套驯服“巨型项目”的姿势。

这篇博客，就是教你用这些姿势降妖伏魔：​​https://docs.cursor.com/guides/advanced/large-codebases​​

•理解代码库

•明确目标 / 搞清改动

•制定计划

•执行变更

第一步：快速理解代码库 (用 Chat 模式)：

面对一个陌生的“巨型”代码库，最怕的就是抓瞎。与其 ​​grep​​​ 来 ​​grep​​ 去不如直接用 Cursor 的 Chat 模式开聊。

( grep 是一个命令行工具，在 Unix/Linux 系统中非常常用，它的功能就是：在文件中搜索匹配某个字符串的行）

• 问问题

• 要细节

• 甚至要示例代码

分分钟搞懂这代码是干啥的、怎么干的。

想让 Cursor 更懂你的代码结构？记得在设置里开启 "Include Project Structure"，能大幅提升性能。

第二步：给 Cursor “立规矩” (写规则)：

想想你刚带新人进团队时，会教他啥？你对这个问题的回答可能是提高Cursor 理解的宝贵信息。

每个项目、每个组织，都有一些文档里没写明白的“潜规则”。把这些“潜规则”用规则 (Rules) 记下来，是让 Cursor 真正理解你的代码库的最好方法。

比如，写个规则告诉 Cursor 怎么实现新功能/服务：

---
描述：添加一个新的 VSCode 前端服务
---
1. 接口定义：
- 使用 `createDecorator` 定义一个新的服务接口，并确保包含 `_serviceBrand` 以避免错误。
2. 服务实现：
- 在一个新的 TypeScript 文件中实现该服务，扩展 `Disposable`，并使用 `registerSingleton` 将其注册为单例。
3. 服务贡献：
- 创建一个贡献文件来导入和加载该服务，并在主入口点注册它。
4. 上下文集成：
- 更新上下文以包含新服务，从而允许在整个应用程序中访问。
---

💡 整体目的

让你的功能模块以服务的形式注入 VSCode 前端架构中，其他模块可通过依赖注入方式访问该服务。

这种模式高度解耦、可测试、可复用，是 VSCode 插件和核心模块开发的重要设计方式。

还可以根据文件类型（用 Glob 表达式）自动关联规则，比如定义代码格式：

---
globs: *.ts
---
- 使用 bun 作为包管理器。相关脚本请参考 [package.json](mdc:backend/reddit-eval-tool/package.json)
- 文件命名统一使用 kebab-case（短横线连接的小写命名）
- 函数名与变量名统一使用 camelCase（驼峰命名法）
- 所有硬编码的常量使用 UPPERCASE_SNAKE_CASE（全大写+下划线分隔）
- 优先使用 `function foo()` 的函数定义方式，而非 `const foo = () =>`
- 使用 `Array<T>` 的形式，而不是 `T[]`
- 推荐使用具名导出（named exports），例如 `export const variable ...` 或 `export function ...`，避免使用默认导出（default export）

这些规则主要用于保证团队代码风格统一、可维护性更高。

第三步：手搓 Plan (但可以找 AI 搭把手):

面对大改动，提前花点时间，仔细规划，能大幅提升 Cursor 的输出质量。如果你发现 Prompt 调来调去还是不行，不如退一步，从头开始，像给同事写 PRD 那样，把计划撸清楚。毕竟，知道 要改什么 才是最难的，这事儿还得人来。

但 AI 也能帮忙规划：打开 Cursor 的 Ask 模式，把能找到的资料 (项目管理系统、内部文档、随便写的想法) 都扔进去。想想你要用到的代码、依赖。这可以是你想集成的代码文件，也可以是整个文件夹。

制定一个关于如何创建新功能的计划（类似于 @existingfeature.ts）
如有任何问题，请向我提问（最多 3 个）
请务必搜索代码库
@Past Chats（我之前的探索提示）
以下是来自 [项目管理工具] 的更多背景信息：
[粘贴的工单描述]

让 AI 帮你理解意图、综合信息、生成计划，有问题还会主动提问。用 Claude-3.7-Sonnet, Gemini-2.5-Pro, O3这种“思考型模型” 效果更好。

有了 AI 辅助，就能迭代完善 Plan，然后再开始执行。

第四步：挑对趁手工具 (这很重要):

高效使用 Cursor 的关键，是根据任务选对工具。想清楚 你要做什么，然后选一个最顺手的。

• Tab： 适合需要完全掌控的快速修改。您希望坐在驾驶座上

• Cmd K： 在需要对代码的特定部分进行重点更改时大放异彩.

• Chat： 适合需要 Cursor 来了解更广泛上下文的较大更改.

用 Chat 模式时 (虽然慢点，但威力巨大)，记得给它提供好上下文。用 ​​@files​​​ 指向你要模仿的代码，用 ​​@folder​​ 让它更好理解你的项目结构。别怕把大任务拆成小块——开新 Chat 能让思路更清晰，效率更高。

要点：

• •缩小更改的范围，不要尝试一次执行太多作
• •尽可能包含相关上下文
• •Tab, Cmd K, Chat，来做他们最擅长的事情
• •经常开新 Chat
• •Ask 模式做计划，Agent 模式来干活

Web 开发神器 Cursor, 这样配置才叫 Pro。

搞 Web 开发讲究的就是快。Cursor 这篇教你怎么把它跟 Figma、浏览器这些家伙打通，形成丝滑闭环，让你迭代飞起。

不过，现在 AI 工具这么强大，我觉得如果不是特别大型的项目，也许可以跳过设计阶段，直接用 AI 来做。这样能省去不少设计时间，保持更高的效率。毕竟，用 AI 工具，很多设计环节都不需要自己一步步来了。

手动在设计工具里敲界面不高效，特别是独立开发者，可能更倾向于直接用 AI 生成吧。

所以我以前也没怎么介绍 Figma 这类工具。之前试用了一下 MCP，效果也就so，so。不如把时间花在怎么琢磨AI生成上。

上手先用 Chat 搭个框架。代码骨架有了，就切到 Cmd+K 和 Tab 精雕细琢，保持心流。看看这波骚操作：用 Cursor 串联 Linear、Figma、浏览器，直接搞定贪吃蛇游戏 (虽然真项目更复杂，但思路就是这样)。

打通项目管理：先拿 Linear 开刀 (用 MCP)。

• 咋整？把官方提供的代码加到 mcp.json，设置里启用，浏览器跳出来授权一下。 (MCP 现在可能得多试几次，不行就去设置里 Reload 服务)。

{
  "mcpServers": {
    "linear": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-remote",
        "https://mcp.linear.app/sse"
      ]
    }
  }
}

• 成了没？聊天里问一句 list all issues related to this project，能看到列表就对了。

设计稿搞进来：Figma 也能用 MCP 连 (社区方案)。

• 开搞：去 framelink.ai 那边看文档，拿到你的 Figma API Key，然后把配置加进 mcp.json。
• 咋用？需要提供具体的 Figma 图层或画框链接，AI 才能访问。

代码风格统一：别让 AI 瞎写。

• 复用是王道：你肯定有现成的组件库、设计规范。多用 @ 引用它们，提示 AI。React/JSX 这类声明式代码，AI 理解起来效果尤其好。

---
描述：实现设计和构建UI
---
从`/src/components/ UI `复用现有的UI组件。这些是我们可以构建的基本元素
如果你找不到任何现有的解决该问题的组件，可以通过编排UI组件来创建新组件
询问人们当缺少组件和设计时他们想如何进行

• 上 Rules (.mdc)：把组件使用规范写成规则喂给 AI。比如搞个 ui-components.mdc 文件，规定优先用 /src/components/ui 下的现有组件，找不到合适的组件时要问你怎么办。组件库大了，规则就拆细点。

连接浏览器：看 Console、Network 请求。

官方也安利了此前我介绍的这个浏览器mcp：

​​比Playwright更高效！BrowserTools MCP 让Cursor直接控制当前浏览器，AI调试+SEO审计效率狂飙！​​

用 Browser Tools MCP 服务器 (去 browsertools.agentdesk.ai 看怎么装)，把浏览器端的日志、网络活动也拉到 Cursor 里。改完代码直接看反馈，验证 bug 超方便。(官方说以后会内置得更简单)

干货总结：

• Web 开发要快，打通工具链 (Cursor + Figma + Linear + 浏览器) 是关键。实现紧密的反馈循环。
• MCP 是神器，减少来回切换，干活更专注。
• 多复用、上规范 (Rules)，有助于AI 生成的代码靠谱、统一。
• 任务拆细，指令给清，AI 才不会跑偏。
  
• 如果 AI 生成的结果不太理想，可以试试调整这两点：
  指令（Instructions）： 明确规则和要求，提供更清晰的提示词，并让 AI 访问更多上下文信息（比如通过 MCP 服务器）。
  系统（Systems）： 采用更清晰的模式、抽象和框架，这样 AI 能更容易理解你的意图，更好地提供帮助，并且更自主地工作。
• 运行时信息 (Console, Network) 也能喂给 AI 当参考。
• 别啥都想自动化，该手动精调 (Tab, Cmd+K) 就手动。
• 把 Cursor 当顶级副驾，最终方向盘还得自己握。

本文转载自​​AI进修生​​，作者：Aitrainee