VS Codeの拡張機能でAIコーディングエージェントを使う方法｜入れ方・必要なプラン・CLIとの違い
この記事の結論
- Claude CodeはVS Codeの拡張機能として使えます。拡張機能ビューで「Claude Code」を検索してインストールし、表示されるSparkアイコンからパネルを開きます。VS Code 1.94.0以降が必要です。
- 使うにはAnthropicの有料プラン(Pro・Max・Team・Enterprise)か、従量課金のClaude Consoleアカウントが必要です。無料プランではClaude Codeは使えません。APIキーは不要で、初回にブラウザでサインインします。
- 拡張機能は画面で変更の差分を確かめられるのが利点です。ただし使えるコマンドはターミナル版(CLI)の一部で、拡張機能を入れただけではターミナルで
claudeコマンドは使えません。
VS CodeでClaude Codeを使う手順を、Anthropicの公式ドキュメント「VS Code拡張機能のページ」(2026年10月24日確認)に沿って整理しました。ターミナルでの使い方はAIコーディングエージェント入門で説明しています。
最終更新: 2026-10-24・読了目安 約7分
必要なもの(バージョンと使えるプラン)
- VS Code 1.94.0以降。バージョンは「ヘルプ」→「バージョン情報」で確認できます。
- Anthropicのアカウント。Claudeの有料プラン(Pro・Max・Team・Enterprise)か、Claude Console(APIの従量課金)のアカウントのどちらかです。APIキーを用意する必要はありません。
セットアップ手順には「無料のclaude.aiプランにはClaude Codeは含まれない」と書かれています(公式のセットアップ手順)。各プランの料金は料金プランの違いにまとめました。Amazon BedrockやGoogle CloudなどのAPI経由で使う方法も公式ドキュメントに載っています。
拡張機能のインストール
- VS Codeで
Cmd+Shift+X(Mac)/Ctrl+Shift+X(Windows・Linux)を押して拡張機能ビューを開きます。 - 「Claude Code」で検索し、発行元がAnthropicの拡張機能(ID
anthropic.claude-code)の「インストール」を押します。
VS Code Marketplaceの配布ページから入れることもできます。同じ拡張機能はCursorにも入ります。拡張機能のバージョン番号は、中に含まれるClaude Codeのバージョンと同じです。
パネルを開いてサインインする
インストールすると、Claude Codeを表すSpark(火花)のアイコンが表示されます。パネルの開き方は次のとおりです。
| 開き方 | 場所 | 注意 |
|---|---|---|
| エディタのツールバー | エディタ右上のSparkアイコン | ファイルを開いているときだけ出る |
| アクティビティバー | 左端のSparkアイコン | 過去の会話の一覧が開く |
| ステータスバー | 右下の「✻ Claude Code」 | ファイルを開いていなくても使える |
| コマンドパレット | Cmd+Shift+P/Ctrl+Shift+Pで「Claude Code」と入力 | 「Open in New Tab」などを選ぶ |
初めてパネルを開くとサインイン画面が出ます。「Sign in」を押し、ブラウザで許可すれば完了です。あとで「Not logged in · Please run /login」と表示されたときは、コマンドパレットの「Developer: Reload Window」でウィンドウを読み込み直します。
基本の使い方:質問・ファイル指定・変更の確認
パネルの入力欄に日本語で指示を書けます。エディタで選択している範囲は自動でClaudeに渡り、Option+K(Mac)/Alt+K(Windows・Linux)を押すと@app.ts#5-10のようなファイル名と行番号の参照が入力欄に入ります。@に続けてファイル名やフォルダ名の一部を打つと、そのファイルを読ませることもできます。
Claudeがファイルを書き換えるときの扱いは、入力欄の下に出ている権限モードで変わります。
- Manual:書き換えの前に、元のファイルと変更案を左右に並べた差分が表示され、承認・却下・別の指示を選べます。
- Auto / Edit automatically:ワークスペース内のほとんどのファイルを確認なしで書き換えます。
初めて使うときや大事なリポジトリでは、差分を見てから承認する使い方がおすすめです。AIの変更の確かめ方は差分(diff)とはとAIが書いたコードのテストとレビューで説明しています。
よく使うショートカット
| 操作 | Mac | Windows・Linux |
|---|---|---|
| エディタとClaudeの入力欄を行き来する | Cmd+Esc | Ctrl+Esc |
| 新しいタブで会話を開く | Cmd+Shift+Esc | Ctrl+Shift+Esc |
| 選択範囲を@参照で入れる | Option+K | Alt+K |
使用量は入力欄で/usageと打つと確認できます。claude.aiのプランでサインインしている場合は、5時間ごとのセッションや週ごとの上限に対する使用状況と、リセットまでの時間が表示されます。
ターミナル版(CLI)との違い
| 機能 | CLI | VS Code拡張機能 |
|---|---|---|
| コマンドとスキル | すべて | 一部(/を打つと一覧) |
| MCPサーバーの設定 | 使える | 使える(/mcp) |
| チェックポイント(巻き戻し) | 使える | 使える |
!で始めるシェル実行 | 使える | 使えない |
| Tabキーでの補完 | 使える | 使えない |
拡張機能の中には専用のClaude Codeが入っていますが、拡張機能を入れただけではターミナルでclaudeコマンドは使えません。CLIを使いたいときは、公式の手順でCLIを別にインストールし、VS Codeの統合ターミナルでclaudeを実行します。拡張機能とCLIは会話の履歴を共有していて、ターミナルでclaude --resumeを実行すると拡張機能での会話を続けられます。ターミナルの基本はターミナルの使い方入門を見てください。
設定で「Use Terminal」をオンにすると、拡張機能のパネルをCLIと同じ見た目に切り替えることもできます。
つまずきやすい点
- インストールできない:VS Codeが1.94.0以降か、拡張機能をインストールできる権限があるかを確かめます。
- Sparkアイコンが出ない:ファイルを1つ開きます(フォルダを開いただけでは出ません)。ほかのAI拡張機能(Cline、Continueなど)を一時的に止める、ワークスペースを信頼する(制限モードでは動かない)、ウィンドウを再読み込みする、も公式に挙がっている対処です。
- APIキーを設定したのにサインインを求められる:VS Codeがシェルの環境変数を引き継いでいないことがあります。ターミナルから
code .で起動するか、Claudeのアカウントでサインインします。 - 無料で使いたい:無料プランは対象外です。まず試すなら月額のProか、使った分だけ払うConsoleを選びます。
よくある質問
Q1. Claude CodeのVS Code拡張機能は無料で使えますか?
拡張機能のインストール自体に料金はかかりませんが、使うにはClaudeの有料プラン(Pro・Max・Team・Enterprise)か、従量課金のClaude Consoleアカウントが必要です。無料プランにはClaude Codeが含まれていません。
Q2. VS Codeのどのバージョンが必要ですか?
VS Code 1.94.0以降です。「ヘルプ」→「バージョン情報」で確認できます。
Q3. 拡張機能とターミナル版はどちらを使えばいいですか?
変更の差分を画面で確認しながら進めたいなら拡張機能が向いています。すべてのコマンドや、!で始めるシェル実行を使いたいならCLIです。両者は会話の履歴を共有しているので、併用もできます。