← 所有文章
claudeClaude Code

在 VS Code 裡用 Claude Code:不用離開編輯器就完成開發

2026年6月6日

我以前的工作畫面:左邊 VS Code,右邊一個終端機跑 Claude Code,視線不停在兩邊之間切換,複製貼上檔名貼到手軟。裝了官方 VS Code 擴充套件之後,這些動作全部消失:選取程式碼按個快捷鍵就帶著行號進對話,改動直接用原生 diff 畫面審。

這篇你會學到

安裝

VS Code 1.98 以上,擴充套件市集搜「Claude Code」安裝,或在 Cursor 等 VS Code 分支裡照樣裝。裝完點編輯器右上角的火花圖示,登入 Anthropic 帳號就能用。看不到圖示的話先開一個檔案(它只在有檔案開著時出現),或點右下角狀態列的 ✱ Claude Code。

每天都在用的五個功能

1. 選取即 context。選一段程式碼,Claude 自動看得到。按 Option+K(Windows 是 Alt+K)還會把 @檔案#行號 的參照插進提示框——「這段為什麼會 race condition」這種問題再也不用貼程式碼。
2. 原生 diff 審核。Claude 要改檔案時顯示並排比對,你可以接受、拒絕,或直接在 diff 裡手動改——改完 Claude 會被告知你動過,不會用舊版本繼續推論。
3. 計畫用 markdown 文件審。切到 Plan mode 時,VS Code 會把計畫開成完整的 markdown 文件,你可以像 review PR 一樣在上面加行內註解給回饋,確認後才動工。
4. Checkpoint 回溯。滑鼠懸停在任一訊息上有個回溯按鈕,三個選項:從這裡分叉對話、把程式碼改動退回這個時點、兩者都做。試錯成本變得很低。
5. 多分頁平行對話。Cmd+Shift+Esc 開新分頁,每個對話獨立 context。分頁圖示上的小點顯示狀態:藍色是等你批准,橙色是做完了。

💡 還有個冷門但好用的:提示裡打 @terminal:名稱 可以把終端機輸出送給 Claude,錯誤訊息不用複製貼上。打 @browser 可以接 Chrome 擴充套件直接操作瀏覽器驗證網頁。

擴充套件 vs CLI:什麼時候回終端機

擴充套件是子集,不是全部:

❌ 指令和 skills 只有部分可用(打 / 看清單)
❌ MCP server 要用 CLI 加(claude mcp add),裝完才能在面板用 /mcp 管理
! bash 捷徑和 tab 補全沒有
好消息是兩邊共用對話紀錄:面板裡聊到一半,終端機跑 claude --resume 就能接著聊。需要 CLI 專屬功能時開內建終端機跑 claude,它會自動跟 IDE 整合(diff 照樣彈在 VS Code 裡)。

常見問題

⚠️ 🔍 官方文件:macOS Tahoe 之後,Cmd+Esc(切換焦點的快捷鍵)會被系統的 Game Overlay 搂截。去系統設定→鍵盤→Game Controllers 把 Game Overlay 關掉才會通。
⚠️ 🔍 官方文件:裝完看不到火花圖示時,先確認有沒有開檔案、再跑 Developer: Reload Window。跟其他 AI 套件(Cline、Continue)同時裝有時會衝突,可以暫時停用其他套件測試。

收尾

擴充套件的價值不是「多了一個聊天面板」,是把「選取→提問→審 diff→接受」這個循環壓縮到不用離開編輯器。重度終端機使用者也值得裝一個,當作 diff 審核器用。
官方文件:Use Claude Code in VS Code

截至 2026年6月6日 驗證有效

← 所有文章OctoDock 首頁 →
在 VS Code 裡用 Claude Code:不用離開編輯器就完成開發 | OctoDock