yycode × Claude Code VS Code 圖形化操作教學
前置條件
- 已完成 Node.js 環境安裝
- 已安裝 Claude Code(
npm install -g @anthropic-ai/claude-code)
1. 安裝 VS Code
前往 VS Code 官網 下載對應平台的安裝包。
Mac 使用者注意選擇正確的芯片架構:
- ARM64:M1 / M2 / M3 / M4 芯片
- x64:Intel 芯片
2. 安裝 Claude Code for VS Code 插件
打開 VS Code,點選左側 擴展市場(Extensions),搜尋 Claude Code for VS Code,認準發布者為 Anthropic,點選 安裝。

安裝完成後,打開任意專案,點選右上角的 Claude Code 圖標 打開插件面板。

3. 建立 API Key
登入 yycode 控制台,進入 權杖管理 頁面,點選 新增權杖。


填寫金鑰名稱,選擇分組(模型和倍率),按需設定 IP 限制、額度限制、模型限制和有效期。新手建議直接使用預設設定。
安全提示:API Key 等同於帳號憑證,請妥善保管,切勿提交到程式碼儲存庫或公開分享。
4. 導入金鑰
點選金鑰旁的 複製 按鈕取得 API Key。

需要設置以下兩個環境變數:
| 變數名 | 值 |
|---|---|
ANTHROPIC_BASE_URL |
https://yycode.net |
ANTHROPIC_AUTH_TOKEN |
您的 API Key |
臨時設置(目前終端機會話有效)
Windows (PowerShell):
$env:ANTHROPIC_BASE_URL = "https://yycode.net"
$env:ANTHROPIC_AUTH_TOKEN = "YOUR_API_KEY"
macOS / Linux:
export ANTHROPIC_BASE_URL="https://yycode.net"
export ANTHROPIC_AUTH_TOKEN="YOUR_API_KEY"
永久設置(重啟後依然有效)
Windows (PowerShell):
[System.Environment]::SetEnvironmentVariable("ANTHROPIC_BASE_URL", "https://yycode.net", [System.EnvironmentVariableTarget]::User)
[System.Environment]::SetEnvironmentVariable("ANTHROPIC_AUTH_TOKEN", "YOUR_API_KEY", [System.EnvironmentVariableTarget]::User)
macOS (Zsh):
echo 'export ANTHROPIC_BASE_URL="https://yycode.net"' >> ~/.zshrc
echo 'export ANTHROPIC_AUTH_TOKEN="YOUR_API_KEY"' >> ~/.zshrc
source ~/.zshrc
Linux (Bash):
echo 'export ANTHROPIC_BASE_URL="https://yycode.net"' >> ~/.bashrc
echo 'export ANTHROPIC_AUTH_TOKEN="YOUR_API_KEY"' >> ~/.bashrc
source ~/.bashrc
5. 跳過官方登入
首次打開插件可能出現 Anthropic 官方登入頁面,顯示三種登入方式。
不要選擇任何一種——等待 3-5 秒頁面會自動消失。如果已按上一步設定好環境變數,插件會自動使用 Dragon Code 的 API Key,無需登入。

如果登入頁面沒有自動消失,左下角點選設置,然後搜尋Claude code,勾選 Disable Login Prompt 手動關閉。

設定成功後介面如下:

6. 開始使用
在輸入框中用自然語言描述需求,通過對話形式與 Claude Code 交互,插件會自動讀取和修改目前專案的程式碼。

7. 使用技巧
三種操作模式
左下角可切換操作模式:

1. Ask before edits(編輯前詢問)
最保守的模式。Claude 每一次修改都會先展示變更內容,征求你的確認後才會寫入檔案。適合剛上手不熟悉工具時使用,或在修改關鍵程式碼時需要逐步把關的場景。
2. Edit automatically(自動編輯)
最高自動化的模式。Claude 會直接修改程式碼檔案,不再逐步確認。適合需求已經明確、希望快速落地修改的場景。需要注意改動可能超出預期,建議事後檢查 Git diff 確認變更範圍。
3. Plan mode(規劃模式)
不直接改程式碼,而是先掃描專案結構,給出完整的修改方案和執行步驟,等你確認後再執行。適合複雜任務,比如程式碼重構、多檔案聯動改動、架構調整等。先看方案再動手,避免大規模改動失控。
多視窗並行開發
點選右上角 + 號可開啟多個 Claude Code 視窗,例如一個負責開發、一個負責測試。

引用專案檔案
在輸入框中輸入 @ 後選擇檔案名稱,可將檔案內容作為上下文傳遞給 Claude Code。

上傳檔案
輸入 /attach file,從檔案選擇器中上傳檔案。

注意:右下角的附件圖標是 引用檔案(新增上下文),不是上傳檔案,注意區分。
切換模型
輸入 /model,選擇 Switch Model,按需切換模型。

常見問題(FAQ)
Q:插件安裝後找不到 Claude Code 圖標?
A:確認插件已安裝成功,嘗試重啟 VS Code。圖標位於編輯器右上角工具欄。
Q:登入頁面一直不消失?
A:在對話框輸入 /config,勾選 Disable Login Prompt 關閉登入提示。
Q:插件提示連接失敗或 401 錯誤?
A:檢查 ANTHROPIC_BASE_URL 是否為 https://yycode.net,以及 ANTHROPIC_AUTH_TOKEN 是否填寫正確且未過期。
Q:如何切換不同模型或倍率?
A:在 yycode 控制台 建立不同分組的金鑰,通過 CC Switch 在多個設定間快速切換。
Q:VS Code 應該選哪個版本?
A:Mac 使用者根據芯片選擇:M 系列芯片選 ARM64,Intel 芯片選 x64。Windows 使用者直接下載預設版本即可。