Claude Code の IDE 統合（VS Code / JetBrains）

Claude Code はターミナルからも使えますが、普段の IDE から離れずに使える IDE 統合がとても便利です。VS Code と JetBrains 系 IDE（IntelliJ IDEA、WebStorm、PyCharm 等）向けの拡張機能が提供されており、エディタのコンテキストを活かしながら AI アシスタントを活用できます。

この記事では、各 IDE への導入方法と、日常の開発フローへの組み込み方を解説します。

IDE 統合の概要

ターミナル版との違い

Claude Code はもともとターミナルで動作する CLI ツールですが、IDE 統合を使うとエディタ内で完結できるようになります。

IDE 統合のメリット

• 選択したコードをそのまま質問: エディタで範囲選択した状態で Claude に投げると、そのコードが自動的にコンテキストに含まれる
• インライン Diff 表示: 変更提案が差分形式で表示され、Accept / Reject を選択できる
• ファイルのシームレスな変更: Claude が提案した変更がエディタに直接反映される。保存前に確認できる
• 統合ターミナル経由での実行: IDE 内のターミナルで Claude Code が動くため、作業コンテキストが途切れない
• CLI との会話共有: VS Code 拡張機能は CLI を内包しており、CLI で開始した会話を IDE 内で継続できます。逆も同様です
• チェックポイント機能: 作業中に Git スナップショットを自動作成し、変更を安全にロールバックできます

Claude Code の 4 つの提供形態

Claude Code は以下の 4 つの形態で提供されています。どれも同じ AI 機能を利用でき、状況に応じて使い分けられます。

併用パターン

IDE 統合とターミナル版は排他的ではなく、状況に応じて使い分けるのが効果的です。

• IDE 統合が向いている: 特定のファイルを見ながらコードの修正・レビュー・質問をするとき
• ターミナル版が向いている: プロジェクト全体をまたぐ大規模な変更、CI/CD スクリプトへの組み込み、複数ステップの自動化タスク

VS Code 拡張機能

インストール方法

VS Code への Claude Code の導入は、VS Code の内蔵ターミナルを経由する形が標準です。拡張機能マーケットプレイスからインストールする方法と、CLI から直接起動する方法の2通りがあります。

動作要件: VS Code 1.98.0 以上が必要です。また、Cursor IDE にも同一パッケージで対応しています。

拡張機能マーケットプレイスからインストール

1. VS Code の左サイドバーの「拡張機能」アイコン（または Ctrl+Shift+X / Cmd+Shift+X）をクリック
2. 検索欄に「Claude Code」と入力
3. Anthropic が公開している「Claude Code」拡張機能を選んで「インストール」をクリック

CLI から直接起動する方法

Claude Code がインストール済みであれば、任意のプロジェクトディレクトリで以下を実行するだけで VS Code と統合された状態で起動します。

claude

VS Code の統合ターミナルで実行すると、VS Code のコンテキスト（開いているファイル、ワークスペース情報）を自動的に認識します。

初期設定

拡張機能のインストール後、初回起動時に以下の設定が求められます。

1. 認証: claude.ai のアカウントで認証（まだの場合はClaude Code をはじめようを先に読んでください）
2. ワークスペースへのアクセス許可: Claude Code がワークスペース内のファイルを読み書きする権限を付与する

つまづきポイント: 「Permission denied」が出る場合は、拡張機能の Permission 設定を確認してください。VS Code の設定（Cmd+, / Ctrl+,）から「Claude Code」を検索し、Workspace Trust の設定を見直します。

サイドパネルでの会話

拡張機能をインストールすると、VS Code の左サイドバーに Claude Code のアイコンが追加されます。クリックするとサイドパネルが開き、そこでチャット形式で会話できます。

サイドパネルからは以下のような操作ができます。

• 自由形式の質問: コードについての質問を自然言語で入力する
• ファイルの参照: @ を入力するとファイル名補完が使え、特定のファイルをコンテキストに追加できる
• 選択範囲の送信: エディタでコードを選択した状態でパネルに質問を入力すると、選択中のコードが自動的に含まれる

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

Tips: キーバインドは VS Code の「キーボードショートカット」設定（Cmd+K Cmd+S / Ctrl+K Ctrl+S）から自分好みに変更できます。「claude」で検索すると Claude Code 関連のショートカットが一覧表示されます。

インライン差分（Diff）の操作

Claude Code が変更を提案すると、エディタ上に差分表示されます。削除行が赤、追加行が緑で表示されるいつもの Git Diff ビューとほぼ同じ見た目です。

• Accept: 変更を受け入れてファイルに反映する
• Reject: 変更を破棄して元のコードを維持する
• Accept All / Reject All: 複数の変更がある場合に一括操作する

つまづきポイント: インライン Diff が表示されず、チャットにコードブロックで返ってくる場合は、拡張機能が最新バージョンかどうか確認してください。古いバージョンではインライン Diff がサポートされていないことがあります。

JetBrains プラグイン

IntelliJ IDEA、WebStorm、PyCharm、GoLand など JetBrains 系の IDE でも Claude Code を使えます。

対応 IDE

• IntelliJ IDEA（Ultimate / Community）
• WebStorm
• PyCharm（Professional / Community）
• GoLand
• Rider
• CLion
• PhpStorm

インストール方法

JetBrains Marketplace からインストール

1. IDE のメニューから Settings（設定） を開く
   • macOS: Cmd+,
   • Windows / Linux: Ctrl+Alt+S
2. Plugins（プラグイン） を選択
3. Marketplace タブを開き、「Claude Code」を検索
4. Anthropic が公開している「Claude Code」プラグインの「Install」をクリック
5. IDE を再起動する

統合ターミナルから起動する方法

VS Code と同様に、JetBrains IDE の統合ターミナルで claude コマンドを実行すると、IDE のコンテキストを活用した状態で Claude Code が起動します。

claude

ツールウィンドウの使い方

プラグインをインストールすると、IDE の右サイドバーに「Claude Code」ツールウィンドウが追加されます（表示されない場合は View > Tool Windows > Claude Code から開く）。

機能的には VS Code 版と同等で、以下のことができます。

• チャット形式での質問・会話
• ファイルをコンテキストに追加（@ファイル名 形式）
• 選択したコードの送信
• インライン Diff の表示と Accept / Reject

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

Tips: JetBrains IDE では Settings > Keymap から「Claude」で検索すると Claude Code 関連のキーバインドが一覧表示されます。競合しているショートカットは赤くハイライトされるので、その場で変更できます。

VS Code 版との機能差異

2026年3月時点では、VS Code 版と JetBrains 版はほぼ同等の機能を提供しています。主な違いは以下の通りです。

つまづきポイント: JetBrains IDE では、プロジェクトを開いた状態でプラグインを有効にしないと、ツールウィンドウが表示されないことがあります。IDE を再起動するか、プロジェクトを閉じて開き直してみてください。

日常の開発フロー

IDE 統合を活用した実際の開発フローを紹介します。

コードを選択して質問する

最もよく使うパターンです。

1. エディタで気になるコード（関数・クラス・ファイル全体など）を選択する
2. Claude Code パネル / ツールウィンドウを開く
3. 質問を入力する（選択したコードは自動的にコンテキストに含まれる）

使用例:

このコードのパフォーマンス上の問題点を教えて

このクラスのメソッドが多すぎる。分割の方針を提案して

このコードに TypeScript の型を追加して

エラー箇所を修正依頼する

コンパイルエラーやランタイムエラーが出たとき。

1. エラーが出ているコードを選択する
2. エラーメッセージをコピーする
3. Claude Code パネルに「このエラーを修正して」とエラーメッセージを貼り付ける

使用例:

以下のエラーが出ています。修正してください。

Type 'string | undefined' is not assignable to type 'string'.
  Type 'undefined' is not assignable to type 'string'.

Claude が修正案を提示したら、インライン Diff で確認して Accept / Reject を選択します。

テストを自動生成する

1. テストを書きたい関数・クラスを選択する
2. 「ユニットテストを書いて」と指示する

使用例:

選択したコードに対してユニットテストを書いて。
フレームワークは Vitest を使用。エッジケースも含めること。

テストファイルが提案されたら、新しいファイルとして保存するか、既存のテストファイルに追記するか選択できます。

コミットメッセージを生成する

1. IDE の統合ターミナルで git diff --staged の内容を確認する（またはそのまま Claude に渡す）
2. 「コミットメッセージを生成して」と依頼する

使用例（チャットパネル）:

@src/utils/date.ts @src/utils/date.test.ts
これらの変更に対して Conventional Commits 形式のコミットメッセージを生成して

使用例（統合ターミナルで Claude Code を起動している場合）:

git diff --staged | claude -p "Conventional Commits 形式でコミットメッセージを生成して"

リファクタリングを依頼する

1. リファクタリング対象のコードを選択する（または @ファイル名 でファイル全体を参照する）
2. リファクタリングの方針を指示する

使用例:

@src/components/UserForm.tsx
このコンポーネントが大きくなりすぎている。責務ごとに分割してほしい。
ただし、props の型定義は変えないこと。

Tips: リファクタリングを依頼するときは「変えてほしくないこと」も一緒に伝えると、意図しない変更を防げます。例えば「テストは変更しないこと」「API の型定義は維持すること」など。

ターミナル版との使い分け

IDE 統合が向いている場面

• ファイル単位の作業: 特定のファイルを見ながらコードを書く・修正する・レビューする
• インタラクティブな編集: 変更案を確認しながら Accept / Reject を繰り返す作業
• コンテキストが明確: どのファイルのどの部分について作業するか決まっている
• 通常の開発作業: フィーチャー実装、バグ修正、リファクタリングなど日常的な開発

ターミナル版が向いている場面

• プロジェクト全体をまたぐ作業: 複数ディレクトリにまたがるリファクタリング、一括検索・置換
• 自動化・スクリプト組み込み: claude -p を使ったシェルスクリプトへの組み込み
• 大規模な変更: 数十ファイル以上に影響する変更を一度に処理させるとき
• CI/CD との連携: GitHub Actions 等のパイプライン内での利用

組み合わせ例: IDE 統合で普段の実装を進めつつ、「全ファイルのコメントを英語に統一して」のような横断的な作業はターミナル版で処理する。

設定とカスタマイズ

VS Code の設定

VS Code の設定（Cmd+, / Ctrl+,）で「Claude Code」を検索すると、以下の項目が設定できます。

JetBrains の設定

Settings > Tools > Claude Code から以下を設定できます。

キーバインドのカスタマイズ

Permission（権限）設定

Claude Code が実行できる操作を制限・許可できます。チームで使う場合や、共有マシンで使う場合に特に重要です。

• Read: ファイルの読み取り
• Write: ファイルの書き込み・変更
• Execute: シェルコマンドの実行

各 IDE の Claude Code 設定から、どのアクションを自動承認するか・毎回確認するかを設定できます。

Tips: 初めて使うプロジェクトでは、Permission を厳しめ（自動承認なし）に設定しておき、Claude の動作に慣れてから緩めるのがおすすめです。

CLAUDE.md でプロジェクト固有の設定を追加する

CLAUDE.md にプロジェクト固有のルールを書くと、IDE 統合でも同様に読み込まれます。

## IDE 利用時の注意

- コードの変更は必ずテストが通ることを確認してから Accept する
- 自動生成したコードはレビュー前にコミットしない
- リファクタリング時は型定義を変更しないこと

詳細はClaude Code をはじめよう — CLAUDE.md の作成を参照してください。

トラブルシューティング

拡張機能 / プラグインが認識されない

症状: インストールしたはずなのに Claude Code のパネルが表示されない。

解決策:

1. IDE を完全に再起動する（ウィンドウを閉じてから再度開く）
2. 拡張機能が有効になっているか確認する（VS Code: 拡張機能一覧で「有効」と表示されているか）
3. Claude Code CLI 本体がインストールされているか確認する: claude --version

認証エラーが出る

症状: 「Authentication failed」や「Not authorized」というエラーが表示される。

解決策:

1. ターミナルで claude を実行して認証が通るか確認する
2. IDE を再起動して再度サインインする
3. API キーを使っている場合は環境変数が正しく設定されているか確認する

echo $ANTHROPIC_API_KEY

つまづきポイント: 環境変数を .bashrc や .zshrc に設定した場合、新しいターミナルセッションを開かないと反映されません。IDE を完全に再起動する必要があります。

インライン Diff が表示されない

症状: Claude の返答がチャットにテキストで表示されるだけで、エディタに差分が出ない。

解決策:

1. 拡張機能を最新バージョンに更新する
2. VS Code の場合: Developer: Reload Window コマンドを実行する（Cmd+Shift+P / Ctrl+Shift+P でコマンドパレットを開いて検索）
3. ファイルが保存されていない（unsaved changes がある）場合に差分表示が抑制されることがあります。まず保存してから試す

レスポンスが遅い

症状: Claude の返答が遅い、タイムアウトする。

解決策:

1. コンテキストウィンドウ（送信するコードの量）を小さくする。設定の contextLines を減らす
2. 大きなファイル全体をコンテキストに含めるのではなく、関連する部分だけを選択して送る
3. /compact コマンドで会話を要約してトークン消費を減らす

VS Code で claude コマンドが見つからない

症状: 統合ターミナルで claude を実行すると「command not found」になる。

解決策: VS Code の統合ターミナルがシステムの PATH を正しく読み込んでいない可能性があります。

// settings.json
{
  "terminal.integrated.defaultProfile.osx": "zsh",
  "terminal.integrated.profiles.osx": {
    "zsh": {
      "path": "zsh",
      "args": ["-l"]
    }
  }
}

次のステップ

IDE 統合を使いこなせたら、Claude Code をさらに深く活用できる記事に進みましょう。

• Claude Code 実践ワークフロー集 — コードレビュー、バグ修正、テスト生成など実践的なワークフロー
• Claude Code をはじめよう — ターミナル版の使い方、CLAUDE.md の設定方法
• 非エンジニア向け Claude Code ガイド — チームメンバーに Claude Code を紹介するときに共有できるガイド