# Vibe Coding 常見問題和解決


你好，我是程式設計師魚皮，前騰訊全端開發，全網 200 萬粉的 [AI 程式設計博主](https://space.bilibili.com/12890453)，也是 [AI 導航](https://ai.codefather.cn) 和 [程式設計導航](https://www.codefather.cn) 等 10+ 自研產品的創造者。

之前我系統講解了 Vibe Coding 的各種技巧和方法，這篇文章我來匯總一下大家在 Vibe Coding 實踐中最常遇到的問題和解決方案。

你可以把它當作速查手冊。遇到問題時，先來這裡找找，說不定就能找到答案。如果這裡沒有，也可以去我的 [程式設計導航](https://www.codefather.cn/) 提問，或者在 [魚皮 AI 導航](https://ai.codefather.cn/) 中跟其他 AI 愛好者交流並尋找答案。




## Vibe Coding 概念理解


### Vibe Coding 和傳統程式設計有什麼區別？

回答：傳統程式設計是你自己寫程式碼，Vibe Coding 是你用自然語言描述需求，讓 AI 幫你寫程式碼。傳統程式設計需要你掌握程式語言的語法和細節，Vibe Coding 更注重需求的表達和 AI 的引導。但本質上，它們都是在解決問題，只是方式不同。你可以把傳統程式設計理解成自己做飯，Vibe Coding 理解成點外賣 —— 最終都能吃上飯，但過程完全不一樣。



### Vibe Coding 適合所有人嗎？

回答：Vibe Coding 降低了程式設計的門檻，讓更多人能參與開發。但它不是萬能的，對於非常複雜的系統、對性能要求極高的專案、需要深度優化的場景，傳統程式設計可能更合適。Vibe Coding 最適合快速原型開發、個人專案、中小型應用、工具類軟體等場景。如果你是零基礎想學程式設計，或者想快速把想法變成產品，Vibe Coding 就很適合你。




### 學了 Vibe Coding 還需要學傳統程式設計嗎？

回答：需要，但不用急。Vibe Coding 能幫你快速實現功能，但要真正理解程式碼、調試複雜問題、優化性能，還是需要程式設計基礎。建議邊用 Vibe Coding 做專案，邊學習程式設計知識。這樣學習效率更高，也更有動力。你可以先用 AI 做出幾個專案，有了成就感後再系統學習程式設計，會比一開始就啃書本有意思得多。




### AI 生成的程式碼靠譜嗎？

回答：AI 生成的程式碼能用，但不一定完美。它可能有 bug、性能問題、安全隱患。所以你需要測試功能、審查程式碼、持續優化。不要盲目相信 AI，要保持批判性思維。就像你點外賣也要檢查一下菜品是否新鮮一樣，AI 生成的程式碼也需要你把關。不過隨著 AI 模型的進步，程式碼質量已經越來越高了。




### Vibe Coding 會取代程式設計師嗎？

回答：不會完全取代，但會改變程式設計師的工作方式。就像計算器沒有取代數學家，搜索引擎沒有取代圖書館員一樣，AI 程式設計工具會成為程式設計師的助手，而不是替代品。未來的程式設計師需要更強的產品思維、架構能力和問題解決能力，而不只是寫程式碼的能力。會用 AI 的程式設計師會比不會用的更有競爭力。




### 什麼是 AI 幻覺？

回答：AI 幻覺是指 AI 編造了不存在的內容，比如虛構了一個不存在的 API、錯誤的函數用法、或者根本不存在的庫。這是 AI 模型的固有問題，因為它是基於概率生成內容的。遇到幻覺時，不要慌，要求 AI 提供文件連結驗證，或者自己查官方文件確認。如果 AI 堅持錯誤，可以換個模型試試，或者開新對話重新描述問題。




### MVP 是什麼意思？

回答：MVP 是 Minimum Viable Product 的縮寫，意思是最小可行產品。簡單來說就是先做一個最簡單但能用的版本，然後再慢慢完善。比如做記賬應用，MVP 版本可能只有記錄支出、查看列表、計算總額這三個功能，其他的分類、圖表、匯出等功能以後再加。這樣做的好處是能快速驗證想法，避免一開始就陷入細節，保持開發動力。




### 什麼是上下文窗口？

回答：上下文窗口是指 AI 模型一次能 “記住” 的內容量，通常用 Token 來衡量。比如 Claude Sonnet 4.5 的上下文窗口是 200K Token，大約相當於 15 萬個中文字。上下文窗口越大，AI 能處理的程式碼量就越多，能記住的對話歷史就越長。如果你的專案程式碼很多，選擇上下文窗口大的模型會更合適，比如 Gemini 3 Pro 支援 1M Token。




## Vibe Coding 工具選擇


### Cursor 和 Windsurf 哪個更好？

回答：兩個都很好，各有特點。Cursor 生態更成熟，社群更大，插件更多，文件更完善。Windsurf 有一些創新功能比如 Cascade 模式，介面也更現代。

如果你是新手，建議從 Cursor 開始，因為遇到問題更容易找到解決方案。如果你喜歡嘗鮮，可以試試 Windsurf。當然最好的辦法是 “我全都要”，兩個都試試，看哪個更適合你的工作方式。




### 免費版夠用嗎？

回答：對於學習和小專案，免費版夠用。Cursor 免費版每月有一些特定模型的額度。但如果是日常工作或大專案，建議用付費版。付費版的額度更多，模型更強，體驗更好，本質是拿金錢換時間。

可以先用免費版試試，覺得好用再升級。學生黨可以充分利用各種免費資源，完全夠學習使用了。




### 如何選擇 AI 模型？

回答：根據任務複雜度和預算選擇。簡單任務用便宜的模型（Gemini Flash、DeepSeek），複雜任務用強大的模型（Claude Opus、GPT-5）。如果做前端 UI，Gemini 3 Pro 表現很好。如果做全棧專案，Claude Sonnet 比較全面。如果預算有限，國產模型（DeepSeek、通義千問、智譜 GLM）性價比很高。

如果不確定，可以用 Auto 模式讓工具自動選擇，或者先用便宜的模型試試，不行再換強模型。




### Bolt.new 和 v0.dev 有什麼區別？

回答：Bolt.new 更適合做全棧應用，能生成完整的前後端程式碼，還能直接在瀏覽器裡運行和調試。v0.dev 更專注於前端 UI 組件，特別擅長生成漂亮的介面。如果你想快速做一個完整的應用，用 Bolt.new。如果你只是想生成一些 UI 組件，用 v0.dev。兩個都是零程式碼平台，不需要安裝軟體，打開瀏覽器就能用，特別適合新手。




### API Key 在哪裡獲取？

回答：去對應服務的官網註冊帳號，然後在設定或 API 頁面生成 Key。比如 OpenAI 的 Key 在 platform.openai.com 獲取，Anthropic 的 Claude Key 在 console.anthropic.com 獲取，Supabase 的 Key 在專案設定裡。

生成 API Key 後記得妥善保管，不要洩露，也不要提交到 GitHub 等公開倉庫。建議用環境變數或設定檔來管理 API Key，避免硬編碼在程式碼裡。




### 如何在國內訪問 Cursor 和 Claude？

回答：Cursor 可以直接訪問，但 Claude 官網在國內訪問可能有困難。可以使用國產模型替代，比如 DeepSeek、通義千問、智譜 GLM 在程式設計能力上已經很接近國際模型了，而且訪問速度更快，價格更便宜。如果一定要用 Claude，可以考慮使用 API 方式，或者通過 OpenRouter 等中轉服務。




### Cursor 有哪些 AI 模式？

回答：Cursor 2.0 主要提供了 2 大 AI 互動模式

1. Chat 模式：對話模式，適合問問題、解釋程式碼、小範圍修改。
2. Agent 模式：最強大的模式，可以自主規劃和執行複雜任務，能同時修改多個文件，支援並行運行多個代理。

如果你只是想問問題或改一個函數，用 Chat 就夠了。如果要新增新功能、涉及多個文件的修改，用 Agent 更合適。Agent 模式還支援 Plan Mode，會先生成計劃讓你確認，再執行修改。




### 選擇零程式碼平台還是程式碼編輯器？

回答：如果你是完全零基礎，或者只是想快速做個原型，用零程式碼平台（Bolt.new、v0.dev）。如果你想做複雜專案，需要更多控制權，或者想學習程式設計，用程式碼編輯器（Cursor、Claude Code 等）。

零程式碼平台簡單快速，但靈活性有限。程式碼編輯器功能強大，但學習難度更大。建議先用零程式碼平台體驗一下，有了感覺再學程式碼編輯器。




## Vibe Coding 使用技巧


### AI 生成的程式碼報錯怎麼辦？

回答：把完整的錯誤訊息和相關程式碼複製給 AI，讓它分析和修復。注意要包含完整的錯誤堆疊，不要只複製一句話。如果 AI 修復不了，可以切換到更強的模型試試，或者開新對話重新描述問題。也可以自己查文件或搜尋解決方案，在社群或論壇求助。很多時候錯誤訊息本身就包含了解決線索，學會看錯誤訊息很重要。




### AI 總是用錯誤的技術棧怎麼辦？

回答：在每次對話開始時，明確說明你的技術棧。比如 “我用的是 React + TypeScript + Tailwind CSS，請用這些技術實現”。

或者在專案中配置 `.cursorrules` 規則文件，讓 AI 自動知道你的技術棧。

如果 AI 還是用錯，及時中斷並糾正：“我用的是 React，不是 Vue，請用 React 重寫！”

多次強調後 AI 就會記住了。




### 如何讓 AI 生成的程式碼更符合專案風格？

回答：提供參考程式碼，讓 AI 模仿。比如：“請參考這個組件的風格來寫新組件”，然後貼上參考程式碼。

或者在上下文文件中詳細說明程式碼風格，包括命名規則、組件結構、註釋格式等。

還可以提供一個程式碼規範文件，讓 AI 按照規範來寫。

最重要的是，提示詞越具體越好，不要只說 “寫得好看一點”，要說清楚什麼是好看。




### AI 生成的程式碼性能不好怎麼辦？

回答：先用 Chrome DevTools、Lighthouse 等工具找到性能瓶頸，然後讓 AI 針對性地優化。比如 “這個列表渲染很慢，請用虛擬滾動優化”，或者 “這個函數在大數據量時很慢，請優化演算法”。

不要一開始就追求完美性能，先讓功能跑起來，發現瓶頸再優化，大部分情況下 AI 生成的程式碼性能已經夠用了。




### 如何處理 AI 的幻覺？

回答：如果 AI 編造了不存在的 API，要求它提供文件連結。如果提供不了，說明是幻覺，讓它用正確的 API。

如果 AI 陷入死循環，切斷上下文，開新對話。

如果 AI 堅持錯誤方案，換個模型試試，或者自己查文件確認。

遇到不確定的內容，一定要驗證，不要盲目相信。建議養成查文件的習慣，這是程式設計師的基本功。




### 如何調試 AI 生成的程式碼？

回答：使用斷點調試，而不是只用 console.log。

可以在瀏覽器或編輯器中設定斷點，單步執行程式碼，查看變數值。這樣能更清楚地看到程式碼的執行過程。如果還是找不到問題，把錯誤訊息和程式碼給 AI，讓它幫你分析。也可以讓 AI 添加詳細的日誌，幫助你理解程式碼的執行流程。

調試是程式設計師的必備技能，值得多花時間學習。




### 如何提高提示詞的質量？

回答：提示詞要具體、清晰、有結構。不要說 “做一個網站”，要說 “做一個記賬網站，包含新增支出、查看列表、統計總額三個功能，介面用藍色調，簡潔現代風格”。

可以把提示詞分成幾個部分：功能需求、介面要求、技術要求。還可以提供參考案例，比如 “介面風格參考 Notion”。

記住，提示詞寫得越詳細，AI 生成的結果越符合預期。




### AI 生成的程式碼太冗長怎麼辦？

回答：讓 AI 重構程式碼，提取重複部分，簡化邏輯。比如 “這段程式碼太長了，請重構一下，提取公共函數，減少重複”。或者 “請用更簡潔的方式實現這個功能”。

AI 一般會優先讓程式碼能跑起來，而不是追求簡潔，所以需要你主動要求優化。不過也不要過度追求簡潔，可讀性更重要。




### 如何讓 AI 解釋程式碼？

回答：通過讓 AI 解釋程式碼，你能更快地理解和學習。可以直接問 AI “這段程式碼是做什麼的？請詳細解釋”，或者 “這個函數的邏輯是什麼？為什麼要這樣寫？”。AI 會用通俗易懂的語言給你解釋。

如果解釋太簡單，可以說 “請更詳細地解釋，包括每一步的作用”。如果解釋太複雜，可以說 “用更簡單的語言解釋，我是新手”，甚至可以說 “我是傻子”，效果可能會出其不意~




### 如何處理 AI 生成的過時代碼？

回答：AI 的訓練數據可能有滯後，所以有時會生成舊版本的程式碼。你需要明確告訴 AI 使用最新版本，比如 “請用 React 19 的最新寫法” 或者 “請用 Next.js 15 的 App Router”。並且一定要提供給 AI 最新的官方文件。




### 如何在提示詞中加入程式碼示例？

回答：直接把程式碼用三個反引號包裹起來，然後貼到提示詞裡。比如：

````markdown
請參考這段程式碼的風格：

```jsx
程式碼內容
```
````

如果程式碼比較長，可以只貼關鍵部分。也可以利用 AI 程式碼編輯器的 `@` 能力，讓 AI 讀取專案中的文件，比如 “請參考 @src/components/Button.tsx 的風格”。提供程式碼示例能讓 AI 更準確地理解你的需求。




### AI 總是生成重複的程式碼怎麼辦？

回答：提醒 AI 提取公共函數或組件。比如 “這些程式碼有很多重複，請提取成公共函數” 或者 “請建立一個可複用的組件”。也可以在提示詞裡明確說 “避免重複程式碼，使用 DRY 原則”。如果 AI 還是生成重複程式碼，可以自己手動重構，或者換個模型試試。




### 如何處理 AI 生成的不安全程式碼？

回答：讓 AI 審查程式碼的安全性。比如 “請檢查這段程式碼是否有安全問題” 或者 “請新增輸入驗證，防止 XSS 攻擊”。也可以使用安全掃描工具，比如前端程式碼可以用 ESLint 的安全插件。對於敏感操作（比如用戶認證、支付），一定要格外小心，最好請有經驗的開發者、或者多用幾個不同的高級 AI 模型來交叉驗證。




## Vibe Coding 專案開發


### 專案做到一半程式碼變得很亂怎麼辦？

回答：及時重構，不要等到完全亂套了再處理。每完成一個功能，花 10 ~ 15 分鐘整理一下程式碼。提取重複程式碼，拆分大函數，改進命名，新增註釋。

如果已經很亂了，可以讓 AI 幫你重構，但要小步進行，每一步都要測試。比如 “請幫我重構這個文件，提取公共函數”，而不是 “重構整個專案”。小步快跑，逐步改進。

注意，重構前一定要先用 Git 提交當前程式碼！這樣即使重構出問題，也能隨時回退到之前的版本。養成頻繁提交的習慣，是保護程式碼的最好方式。




### 如何部署 AI 生成的專案？

回答：很多零程式碼平台（比如 Bolt.new）支援一鍵部署，點個按鈕就能上線。

如果要手動部署，可以用 Vercel、Netlify 等平台。把程式碼推送到 GitHub，然後在平台上連接倉庫，它會自動構建和部署。

如果需要後端，可以用 Supabase 等 BaaS 服務。如果需要用自己的伺服器，可以利用 Docker 容器化部署。

總之，部署其實沒那麼難，跟著魚皮的部署教程一步步來就行。




### 專案上線後出了 bug 怎麼辦？

回答：首先，用監控工具（Sentry、LogRocket）收集錯誤訊息。然後，在本地復現問題，找到原因。

修復後，讓 AI 多寫測試，確保問題不再出現。最後盡快部署修復版本。

為了避免這種情況，上線前要充分測試，包括功能測試、邊界情況測試、不同設備測試。可以讓朋友幫忙測試，往往能發現你一個人沒注意到的問題。




### 如何從玩具專案變成真正的產品？

回答：需要考慮到很多方面，比如

1. 完善錯誤處理，考慮各種異常情況
2. 新增測試，確保功能穩定
3. 優化性能，讓應用跑得更快
4. 加強安全，保護用戶數據
5. 改進 UI，讓應用更好用
6. 寫好文件，方便維護和擴展
7. 還要考慮 SEO、監控、日誌等

這是一個持續改進的過程，不要想著一步到位。每次改進一點，慢慢就能變成真正的產品。




### 如何評估專案的質量？

回答：不要只關注功能，質量同樣重要。一個功能完整但 bug 一堆的專案，不如一個功能簡單但穩定可靠的專案。

可以從這幾個方面評估：

- 功能完整性（是否實現了所有需求）
- 程式碼質量（是否清晰、可維護）
- 性能表現（加載速度、響應速度）
- 安全性（有沒有漏洞）
- 用戶體驗（是否好用）
- 測試覆蓋率（是否有足夠的測試）




### 遇到 AI 解決不了的問題怎麼辦？

回答：首先，一定不要對著一個 AI 死磕，可以換個 AI 模型試試，不同模型擅長的領域不一樣。

如果你有程式設計