VS Code / JetBrains連携を極める

このレッスンで学ぶこと

VS Code拡張機能でターミナル単体よりも生産性高くClaude Codeを使う方法を理解する
JetBrains IDEプラグインの導入とワークフローへの組み込み方を身につける
IDE固有のショートカットを最適化し、フォーカス切り替えのストレスをなくす
IDE上でClaude Codeが認識できない・反応しないといった典型的なトラブルを自力で切り分けられるようになる

前提条件

応用コースの前半（MCP・Hooks・Skills・サブエージェント・Agent SDK）、または実践コースを通じてClaude Codeを日常的に使っていること
VS CodeまたはJetBrains系IDE（IntelliJ IDEA、PyCharム、WebStormなど）のいずれかを普段使っていること

なぜ「ターミナルのClaude Code」だけでは物足りなくなるのか

ここまでの応用コースでは、MCP・Hooks・Skills・サブエージェントといった「Claude Codeの中身」を拡張する話をしてきました。このレッスンでは視点を変え、「Claude Codeをどこから操作するか」というインターフェースの話をします。

ターミナルでのClaude Code利用に慣れてくると、次のような細かい不満が積み重なっていきます。

提案された差分を確認するために、エディタとターミナルを何度も行き来する
ファイルを参照させるたびにパスを手で入力する
複数のタスクを並行して進めたいのに、ターミナルタブの管理が煩雑になる

VS Code拡張機能とJetBrainsプラグインは、こうした摩擦を解消するために作られています。CLIの機能を置き換えるものではなく、同じCLIエンジンの上に「視覚的な差分表示」「ファイル参照のショートカット」「セッション管理UI」を重ねたレイヤーだと捉えると理解しやすくなります。

CLIとIDE拡張は共存できる

VS Code拡張機能・JetBrainsプラグインのどちらも、内部的には同じClaude Code CLIを利用しています。設定ファイル（~/.claude/settings.jsonなど）やMCPサーバー設定も共有されるため、「ターミナルではこのプロジェクト、IDEでは別のプロジェクト」のように使い分けても、ルールが食い違うことはありません。

VS Code拡張機能の高度な使い方

差分表示とインライン編集の確認

VS Code拡張機能の最大の価値は、Claude Codeが提案する変更を「並べて比較する差分ビュー」で確認できる点です。ターミナルでもdiff形式の出力は読めますが、構文ハイライト付きの差分をエディタ上で直接確認し、その場で手を加えてから受け入れられる体験は質的に異なります。

差分を確認しているとき、提案された内容を自分で書き換えてから「受け入れる」を押すと、Claude Code側はその変更が記録され、次のやり取りで「あなたが手を加えた」ことを踏まえて応答します。提案をそのまま鵜呑みにせず、人間のレビューを差分の段階で挟めることが、コードレビュー文化を持つチームでは特に重要になります。

@-メンションでコンテキストを渡す

ファイルパスを手打ちする代わりに、プロンプトボックスで@を入力するとあいまい検索でファイルやフォルダを参照できます。

@auth のロジックを説明して
@src/components/ に何が入っているか教えて

エディタ上でコードを選択した状態であれば、選択範囲は自動的にClaude Codeへ共有されます。明示的に行範囲付きの参照を挿入したい場合は、Option+K（Mac）/ Alt+K（Windows/Linux）でカーソル位置に@app.ts#5-10のような参照を挿入できます。

選択範囲の共有を止めたいファイルがある場合

.envのような機密ファイルを誤ってClaude Codeに見せたくない場合は、Readの拒否ルールをそのパスに対して設定します。一致するdenyルールがあると、選択中のテキストやファイルを開いている通知そのものがClaude Codeに渡らなくなります。権限設計の詳細は組織導入コースで扱います。

プランモードと自動受け入れモードの使い分け

プロンプトボックス下部のモード表示をクリックすると、許可モードを切り替えられます。

モード	動作	向いている場面
通常モード	アクションごとに許可を求める	初めて触るコードベース、影響範囲が読めない変更
プランモード	実行前に計画をMarkdownで提示し、承認を待つ	大きめのリファクタリング、設計レビューを挟みたいとき
自動受け入れモード	許可を求めずに編集を進める	信頼できる定型作業、繰り返しのタスク

プランモードで提示された計画にはインラインコメントを残せるため、「ここはこういう方針にしてほしい」という意図を実行前にすり合わせられます。チームでレビュー文化を重視するなら、大きな変更ほどプランモードから始める習慣をつけるとよいでしょう。

複数会話の並行管理

コマンドパレットから「Open in New Tab」や「Open in New Window」を選ぶと、独立した会話を追加で開始できます。それぞれが個別の履歴とコンテキストを持つため、「メインタスクの実装」と「ちょっとした調査」を同時並行で進められます。

タブのアイコンに付くドットの色で状態が一目でわかります。青は許可待ち、オレンジは非表示中に処理が完了したことを示します。複数タブを行き来する運用では、このインジケーターを横目で見ながら手の空いたタブから処理していくと効率的です。

メインのセッションをサイドバーに固定する

日常的に使う会話はセカンダリサイドバー（画面右側）にドラッグして配置すると、コードを見ながら常に視界に入れておけます。

サブタスクはエディタタブで開く

「ついでに調べたいこと」「別ファイルの修正」はエディタ領域にタブとして開きます。メインの会話の流れを汚さずに並行作業できます。

ターミナルモードが必要な場面を見極める

!によるbashショートカットやタブ補完はCLI限定の機能です。これらが必要な操作は、統合ターミナルでclaudeを直接起動するか、VS Code設定の Use Terminal をオンにしてターミナルモードに切り替えます。

JetBrains IDE連携の設定とワークフロー

IntelliJ IDEA、PyCharm、WebStorm、PhpStorm、GoLand、Android StudioといったJetBrains系IDEには、専用のプラグインを通じてClaude Codeを統合できます。VS Code拡張機能との大きな違いは、プラグインがCLIを内蔵していない点です。プラグインはIDEの統合ターミナルで動くclaudeコマンドに接続する仕組みなので、CLI本体のインストールが別途必要になります。

導入の流れ

Claude Code CLIをインストールする

まだの場合は入門コース Lesson 1の手順に従ってインストールします。claudeコマンドがPATHに通っていないと、プラグインが「Claude Codeを起動できません」という通知を出します。

JetBrainsマーケットプレイスからプラグインを入れる

各IDEの Settings → Plugins から「Claude Code」を検索してインストールし、IDEを再起動します。再起動が1回で反映されないこともあるため、反応がなければもう一度再起動してみましょう。

統合ターミナルでclaudeを起動する

IDEの統合ターミナルでclaudeを実行すると、診断エラーの共有や選択コンテキストの連携など、すべての統合機能が自動的に有効になります。

外部のターミナル（IDEに内蔵されていないターミナルアプリ）から起動した場合でも、/ideコマンドを実行すればJetBrains IDEに接続できます。

/ide

JetBrains統合の利点

診断共有: IDEのLintやコンパイルエラーが自動的にClaude Codeとのやり取りに含まれるため、「このエラーを直して」とだけ伝えれば文脈を理解した修正が返ってきます
ファイル参照ショートカット: Cmd+Option+K（Mac）/ Alt+Ctrl+K（Windows/Linux）で@src/auth.ts#L1-99のような参照を挿入できます
diffビューイング: ターミナルではなくIDE純正の差分ビューアで変更を確認できます

リモート開発環境では設置場所に注意

JetBrainsのリモート開発機能を使っている場合、プラグインは手元のクライアントマシンではなく、リモートホスト側にインストールする必要があります。Settings → Plugin (Host) からリモートホストへインストールしましょう。ローカルにだけ入れても接続できません。

IDE固有のショートカット最適化

ショートカットは「覚える」より「自分のキー配置に合わせて整理する」ことが重要です。デフォルトのキーバインドが他の拡張機能と衝突するケースは珍しくありません。

VS Codeの主要ショートカット

操作	ショートカット	補足
エディタ⇔Claude間のフォーカス切り替え	`Cmd+Esc` / `Ctrl+Esc`	最も使う頻度が高いショートカット
新しいタブで会話を開く	`Cmd+Shift+Esc` / `Ctrl+Shift+Esc`	並行作業を始めるとき
@-メンション参照の挿入	`Option+K` / `Alt+K`	エディタにフォーカスがある状態で実行
閉じたセッションタブの再オープン	`Cmd+Shift+T` / `Ctrl+Shift+T`	ブラウザの「閉じたタブを開く」と同じ感覚

macOS Tahoe以降では、システムのゲームオーバーレイ機能がデフォルトでCmd+Escを奪っていることがあります。フォーカス切り替えが反応しないときは、システム設定の「キーボード → キーボードショートカット → ゲームコントローラー」でゲームオーバーレイのチェックを外すか、VS Codeのキーボードショートカットエディタ（Cmd+K Cmd+S）でClaude Code: Focus inputを別のキーに割り当て直します。

JetBrainsの主要ショートカット

操作	ショートカット
エディタから直接Claude Codeを開く	`Cmd+Esc` / `Ctrl+Esc`
ファイル参照の挿入	`Cmd+Option+K` / `Alt+Ctrl+K`

JetBrainsのターミナルでは、ESCキーがフォーカスをエディタへ戻すデフォルト動作と衝突し、Claude Codeの操作を中断できないことがあります。これは Settings → Tools → Terminal で「Move focus to the editor with Escape」をオフにするか、該当のキーバインドを削除することで解消できます。

自分の手癖に合わせてカスタマイズする時間を惜しまない

最初の数分でショートカットを自分の指癖に合わせておくと、その後の数百回の操作で確実に時間が浮きます。特にフォーカス切り替えのショートカットは1日に何十回も使うため、最優先で確認しておきましょう。

IDE上でのデバッグ・トラブルシューティング

IDE連携特有のつまずきは、ほとんどが「拡張機能・プラグインが正しく検出・接続されていない」ことに起因します。落ち着いて切り分ければ大半は自力で解決できます。

VS Codeで拡張機能アイコンが出ない場合

ファイルを1つ開いているか確認する（フォルダを開いただけではアイコンが表示されません）
VS Codeのバージョンが1.98.0以上か確認する（Help → About）
コマンドパレットから「Developer: Reload Window」を実行する
競合する可能性のある他のAI拡張機能を一時的に無効化する
ワークスペーストラストが「制限モード」になっていないか確認する

それでも表示されない場合は、ステータスバー右下の「✱ Claude Code」をクリックするか、コマンドパレットから直接「Claude Code」を検索して開く方法でも代替できます。

JetBrainsでIDEが検出されない場合

「No available IDEs detected」と表示される典型的な原因は次の3つです。

プラグインが有効化されていない、またはインストールされていない
IDEの再起動が必要（複数回必要なこともある）
統合ターミナル以外からClaude Codeを起動している

WSL環境のJetBrainsで発生する場合は、WSL2のNATネットワークやWindowsファイアウォールがWSL2とWindows側IDEの通信をブロックしていることが原因であるケースが大半です。WSL側でhostname -Iを実行してIPアドレスのサブネットを確認し、PowerShell（管理者権限）から該当サブネットへのインバウンド通信を許可するファイアウォールルールを追加するか、Windows 11 22H2以降であれば.wslconfigにnetworkingMode=mirroredを設定してミラーリングネットワークへ切り替えることで解消します。

New-NetFirewallRule -DisplayName "Allow WSL2 Internal Traffic" -Direction Inbound -Protocol TCP -Action Allow -RemoteAddress 172.21.0.0/16 -LocalAddress 172.21.0.0/16

自動編集モードとIDE設定ファイルの安全性

VS CodeでもJetBrainsでも、自動編集権限を有効にした状態でClaude Codeを動かすと、IDEが自動的に読み込む設定ファイル（settings.jsonやtasks.jsonなど）を書き換えられてしまう可能性があります。信頼できないコードベースで作業するときは、手動承認モードを使う、VS Codeの制限モードを有効にするなど、慎重な運用を心がけてください。

困ったときの共通の入口

VS Code・JetBrainsいずれの問題であっても、まずは/doctorを実行する習慣をつけましょう。インストール状態・設定・MCPサーバーの接続状況・コンテキスト使用量を一括でチェックしてくれます。IDE固有の問題が解決しない場合は、各拡張機能・プラグインの「Show Logs」やデバッグログを確認し、GitHubのIssueで既知の問題かどうかも調べてみてください。

まとめ

このレッスンでは、ターミナル単体では得にくい開発体験をVS CodeとJetBrainsの統合がどう補ってくれるかを見てきました。

VS Code拡張機能は差分ビュー・@-メンション・プランモード・複数タブ管理によって、レビューしながら進める開発スタイルを実現する
JetBrainsプラグインはCLIを内蔵せず、統合ターミナルのclaudeに接続する設計のため、CLI本体のインストールが前提になる
ショートカットは自分の環境に合わせて早めに最適化すると、長期的な時間効率に直結する
IDE連携のトラブルの多くは「検出されない」「接続されない」に集約され、再起動・バージョン確認・競合拡張機能の無効化といった定番の切り分け手順で解決できることが多い

IDEとの統合は、Claude Codeを「ターミナルツール」から「開発フローに溶け込んだパートナー」へと変える重要な要素です。次のレッスンでは、さらに視点を広げ、IDEからも離れた場所からClaude Codeを操作する方法を見ていきます。

次のステップ

次のLesson 12では、Remote Control APIを使って外部システムからClaude Codeを制御する方法を学びます。CI/CDパイプラインやカスタムツールから、IDEを開かずにClaude Codeを動かしたいと感じたら、ぜひ読み進めてください。