VS Code 統合

VS Code で Claude Code 拡張機能と GitHub Copilot カスタムエンドポイントを使う：拡張の導入、primaryApiKey 設定、chatLanguageModels.json で QCode に接続

最終確認：2026-09-18 · 📄 公式ドキュメント準拠（VS Code 1.138.0、2026-09-16 公開）

概要¶

Trae IDE をお使いですか？ Trae は VS Code のフォークで、ほとんどの手順がそのまま適用できます。マーケットプレイスの違い、オフライン .vsix インストール、Trae 内蔵 AI との共存など Trae 固有の詳細は Trae 統合ガイド を参照してください。

ターミナルで Claude Code CLI を使用するだけでなく、VS Code 拡張機能を使用してエディタ内で直接 Claude Code にアクセスし、より便利な開発体験を得ることができます。

前提条件¶

VS Code 拡張機能を設定する前に、以下を確認してください：

1. Claude Code CLI がインストールされ、正常に動作している

2. インストールガイド を参照してインストールを完了

3. 環境変数の設定 を参照して設定を完了

4. VS Code バージョン >= 1.98.0

インストール手順¶

ステップ 1：VS Code のインストール¶

VS Code がインストールされていない場合は、VS Code 公式サイト からダウンロードしてインストールしてください。

ステップ 2：Claude Code 拡張機能のインストール¶

VS Code で：

1. 拡張機能パネルを開く（Ctrl+Shift+X / Cmd+Shift+X）

2. "Claude Code for VS Code" を検索

3. インストール をクリック

またはコマンドラインでインストール：

code --install-extension anthropic.claude-code

ステップ 3：primaryApiKey の設定¶

これは重要なステップです！Claude Code 拡張機能は設定ファイルに primaryApiKey を必要とします。

{
  "primaryApiKey": "qcode"
}

# ディレクトリを作成（存在しない場合）
mkdir -p ~/.claude

# 設定ファイルを作成
cat > ~/.claude/config.json << 'EOF'
{
  "primaryApiKey": "qcode"
}
EOF

# ディレクトリを作成（存在しない場合）
mkdir -p ~/.claude

# 設定ファイルを作成
cat > ~/.claude/config.json << 'EOF'
{
  "primaryApiKey": "qcode"
}
EOF

注意：primaryApiKey の値は何でも構いません（qcode など）。このフィールドを設定するだけで OK です。実際の API 認証は、環境変数で設定した ANTHROPIC_AUTH_TOKEN を使用します。

重要：設定ファイルは config.json であり、settings.json ではありません。これら 2 つのファイルを注意して区別してください。

ステップ 4：VS Code を再起動¶

設定完了後、VS Code を再起動して変更を有効にします。

使用方法¶

キーボードショートカット¶

よく使う機能¶

1. コード説明

2. コードを選択

3. 右クリックで "Ask Claude" を選択するかショートカットを使用

4. 質問を入力、例：「このコードを説明して」

5. コード生成

6. Claude パネルを開く

7. 必要な機能を説明

8. Claude がコードを生成し、挿入オプションを提供

9. コードリファクタリング

10. リファクタリングするコードを選択

11. Claude にリファクタリングを依頼

12. プレビューして変更を適用

13. エラー修正

14. コードにエラーがある場合

15. エラーコードまたはメッセージを選択
16. Claude に分析と修正案を依頼

設定オプション¶

VS Code 設定で Claude Code 拡張機能の動作を設定できます：

1. 設定を開く（Ctrl+, / Cmd+,）

2. "Claude Code" を検索

3. 必要に応じてオプションを調整

よく使う設定¶

{
  "claude-code.autoSuggest": true,
  "claude-code.inlineChat": true
}

ターミナル CLI との併用¶

VS Code 拡張機能とターミナル CLI は一緒に使用できます：

GitHub Copilot のカスタムエンドポイント¶

VS Code 1.122 以降、内蔵の Copilot Custom Endpoint で QCode の各プロトコルを Copilot に直接接続できます（Claude は messages のみ、url は完全パスを入力）。最小設定：

[
  { "name": "QCode Claude", "vendor": "customendpoint", "apiKey": "cr_your-QCode-key",
    "apiType": "messages",
    "url": "https://api.qcode.cc/api/v1/messages",
    "toolCalling": true,
    "models": [ { "id": "claude-sonnet-5" } ] }
]

3 プロトコル全体の設定、Copilot CLI の BYOK、既知の制限（インライン補完は引き続き GitHub 経由）は専用ページ GitHub Copilot 連携 を参照。

トラブルシューティング¶

拡張機能が起動しない¶

1. Claude Code CLI が正しくインストールされていることを確認

2. 環境変数の設定を確認

3. config.json ファイルの形式が正しいことを確認

primaryApiKey エラー¶

1. ファイルパスが正しいことを確認：

2. Windows: C:\Users\ユーザー名\.claude\config.json

3. macOS/Linux: ~/.claude/config.json

4. config.json であって settings.json ではないことを確認

5. JSON 形式が有効であることを確認

接続タイムアウト¶

1. ネットワーク接続を確認

2. ANTHROPIC_BASE_URL 環境変数を確認

3. ターミナルで claude を実行して CLI が動作することを確認

次のステップ¶

• CLI テクニック で効率を向上

• ワークフロー で開発フローを最適化