官方指南！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
