Claude CodeをVSCodeで使う方法 拡張機能の導入手順と基本操作・CLIとの違い

Claude Codeを試したいものの、ターミナルでの操作に抵抗がある。あるいは、すでにCLIで使っていて、差分の確認がしづらいと感じている。どちらの立場でも、VS Codeの拡張機能を入れることで状況は変わります。

拡張機能を使えば、コマンドを覚えなくても画面上の操作だけで完結します。変更内容は左右に並べた差分として表示され、内容を確認してから承認できます。エディタで選択した範囲をそのまま指示に含める操作も、クリックひとつで済みます。

国内での生成AI活用も進みました。総務省が2026年7月に公表した調査では、何らかの業務で生成AIを利用している企業の割合は86.4%に達しています。開発の現場でも、AIを前提とした進め方が標準になりつつあります。

本記事では、公式ドキュメントの内容にもとづき、前提条件からインストール、基本操作、便利な機能、設定、つまずきやすい点までを順に整理しました。下の表から、気になる項目に直接移動できます。

確認したいポイント	結論	詳細
拡張機能とCLIの違いは？	GUIで完結するかどうか	拡張機能は差分表示や履歴を画面上で扱え、CLIは全コマンドが使える点が異なります。
使うのに何が必要？	VS Code 1.94以上と有料契約	Pro・Max・Team・EnterpriseかConsoleのアカウントが必要で、APIキーは不要です。
どうやって導入する？	拡張機能ビューから1クリック	「Claude Code」で検索し、発行元がAnthropicのものを選んでインストールします。
最初に何をすればいい？	サインインしてパネルを開く	ブラウザで認証を済ませ、Sparkアイコンからパネルを開いて指示を出す流れになります。
基本の操作は？	@指定と差分の確認が中心	ファイルを@で指定し、提案された差分を確認したうえで承認する流れが基本です。
効率を上げる機能は？	履歴・巻き戻し・並行作業	セッション履歴の検索、変更の巻き戻し、タブごとの並行作業に対応しています。
設定は変えられる？	表示位置や承認方法を変更可	パネルの配置、初期の権限モード、ターミナル表示への切り替えが設定できます。

この記事でわかること

• VS Code拡張機能とCLI版の機能差と、どちらを選ぶべきかの判断基準
• 導入に必要なVS Codeのバージョンとアカウントの条件
• インストールからサインイン、最初の指示までの具体的な手順
• @メンション、差分レビュー、権限モードといった基本操作の使い方
• セッション履歴や巻き戻しなどの機能と、つまずいたときの対処法

AIを前提とした開発体制、社内で整備が進んでいますか？ 株式会社ネクストスケールでは、法人企業向けにAI研修とAI開発支援を提供しています。ツールの導入だけでなく、現場で使われ続ける体制の設計までご相談いただけます。 ▶ AI研修・AI導入支援について相談する（無料）

Claude CodeのVS Code拡張機能とは？CLIとの違い

Claude Codeは、ターミナルから使うCLIと、VS Codeに組み込む拡張機能の両方が提供されています。公式ドキュメントでは、VS Codeで使う場合は拡張機能が推奨される方法として案内されています。

どちらを選んでも、動作の中身は同じです。会話の履歴も共有されるため、途中で切り替えても作業は継続できます。

拡張機能でできること

拡張機能は、Claude Codeをグラフィカルな画面で操作するための仕組みです。変更内容を左右に並べた差分で確認する、会話履歴を検索する、複数の会話をタブごとに並行して進めるといった操作が、画面上で完結します。

実行前の計画を確認して修正できる点も特徴です。大きめの改修では、いきなり編集させるのではなく、方針を読んでから進める使い方ができます。

パネルの位置も自由に変えられます。コードを書きながら常に見える位置に置くのか、必要なときだけタブとして開くのかを、自分の作業スタイルに合わせて決められる構成です。

CLIとの機能差

すべての機能が拡張機能側にあるわけではありません。コマンドやスキルはCLIが全対応であるのに対し、拡張機能では一部に限られ、タブ補完やシェルコマンドの短縮入力も利用できません。

MCPサーバーの設定も、追加はCLIから行う形になります。追加後の管理は拡張機能側の画面で行えるため、初期設定だけターミナルを使う流れです。

CLIだけの機能が必要になったら、VS Codeの統合ターミナルでコマンドを実行すれば済みます。この場合はCLIを別途インストールしておく必要があります。

会話の履歴が共通である点も重要です。拡張機能で始めた作業をターミナルから続ける、あるいはその逆といった行き来ができるため、どちらか一方に決め打ちする必要はありません。

どちらを選ぶべきか

判断の目安は明確です。画面を見ながら差分を確認して進めたいなら拡張機能、コマンドを自在に使いたいならCLIという分け方になります。

ターミナルの操作に慣れていない方や、コードを書かない職種の方には拡張機能が向いています。両方を併用しても問題はないので、まず拡張機能から始めて必要に応じて広げる進め方が現実的です。

ターミナルからの導入手順については、Claude Codeの始め方を解説した記事で詳しく紹介しています。

導入前の前提条件｜バージョンとアカウント

インストールの前に、2つの条件を確認してください。必要なのは、VS Code 1.94.0以上のバージョンと、Anthropicの有料アカウントです。

順に見ていきます。

VS Codeのバージョン

公式ドキュメントでは、VS Code 1.94.0以上が必要とされています。バージョンが古いと拡張機能をインストールできないため、先に確認しておきましょう。

確認はメニューのヘルプから行えます。バージョンが足りない場合は、VS Codeを更新してから作業を進めてください。

更新を後回しにしていると、この段階でつまずきます。数分で終わる作業なので、インストールに取りかかる前に済ませておくほうが結果的に早く進みます。

必要なアカウント

利用には有料のアカウントが必要です。Claudeの有料プラン（Pro、Max、Team、Enterprise）またはClaude Consoleのアカウントがあれば使え、APIキーの発行は不要とされています。

無料プランでは利用できません。まず契約を済ませてから、インストールに進んでください。

Amazon BedrockやGoogle Cloud、Microsoft Foundryといった事業者経由でClaudeを使っている場合は、別途の設定手順が用意されています。組織で導入する際は、この経路も選択肢になります。

CLIとの関係

拡張機能には、チャットパネル用のCLIが同梱されています。ただし、この同梱版は統合ターミナルからは呼び出せず、claudeコマンドを打つには別途インストールが必要です。

拡張機能だけで使うなら、追加の作業はありません。ターミナルからもコマンドを使いたい場合に限り、CLIのインストールを済ませておきましょう。

拡張機能のインストール手順

導入は数分で終わります。VS Codeの拡張機能ビューから検索してインストールするだけで、コマンドの入力は必要ありません。

手順を確認していきます。

拡張機能ビューから導入する

VS Codeでショートカットキーを押し、拡張機能ビューを開きます。

Mac：Cmd+Shift+X　／　Windows・Linux：Ctrl+Shift+X

検索欄に「Claude Code」と入力し、表示された拡張機能をインストールします。似た名前の非公式なものが並ぶ場合があるため、発行元がAnthropicであることを必ず確認してください。

インストール自体は数十秒で完了します。導入後にエディタの再起動を求められることがありますが、指示に従って進めれば問題ありません。

VS Code以外のエディタでも使える

同じ拡張機能は、VS Codeから派生したエディタにも導入できます。Cursorをはじめ、複数のエディタで同じ拡張機能を検索してインストールできる構成になっています。

マーケットプレイスからの導入ができない環境では、CLIをインストールして統合ターミナルから使う方法が案内されています。CLIはどのターミナルでも動作します。

エディタ自体にAIが組み込まれたツールとの比較を知りたい方は、AIコードエディタCursorを解説した記事もあわせてご覧ください。

インストール後に表示されない場合

導入したのにアイコンが見当たらないことがあります。VS Codeを再起動するか、コマンドパレットからウィンドウの再読み込みを実行すると解決するケースがほとんどです。

それでも表示されない場合は、後述するトラブルシューティングの項目を確認してください。原因はいくつかのパターンに絞られます。

導入は済んでも、現場で使われないという状態になっていませんか？ ツールを配るだけでは活用は広がりません。ネクストスケールでは、業務内容に合わせたAI活用の設計と、現場向けの実践研修をあわせて提供しています。 ▶ 現場定着の進め方を相談する（無料）

サインインと最初の操作

インストールが終わったら、アカウントとの紐づけを行います。パネルを開くとサインイン画面が表示されるので、ブラウザ側で認証を済ませるだけです。

その後、最初の指示を出すところまで進めていきましょう。

パネルを開く4つの方法

Claude Codeを開く入口は複数あります。もっとも手早いのは、エディタ右上に表示されるアイコンをクリックする方法で、ファイルを開いているときに表示されます。

画面左のアクティビティバーからはセッションの一覧を開けます。こちらのアイコンは常に表示されるため、ファイルを開いていない状態でも使えます。

コマンドパレットで「Claude Code」と入力する方法と、画面右下のステータスバーをクリックする方法もあります。ステータスバーからの起動は、ファイルを開いていなくても機能します。

入口が複数あることは、慣れるまでは混乱の原因にもなります。まずはエディタ右上のアイコンを使う方法だけ覚えておき、必要になったら他の入口を試す進め方で十分です。

サインインの手順

パネルを初めて開くと、サインイン画面が表示されます。ボタンをクリックすると、ブラウザで認証の画面が開くので、そのまま承認を進めてください。

サインイン後は、機能を順に試せるチェックリストが表示されます。ひととおり触ってみると、どこに何があるかを掴めます。不要であれば閉じることもできます。

最初の指示を出す

準備が整ったら、プロンプト欄に指示を入力します。コードの説明を求める、不具合の原因を調べさせる、修正を依頼するといった内容を、日本語で伝えて構いません。

エディタで文字を選択していれば、その範囲は自動的に伝わります。最初は「このファイルが何をしているか説明して」といった質問から始めると、動作を確認しやすくなります。

コードを書かない職種でも、AIに作業を任せられます ネクストスケールのAI研修は、職種ごとの業務に合わせた実践形式です。ツールの操作方法ではなく、自分の仕事のどこにAIを使うかを見つけられる状態を目指します。 ▶ 職種別のAI研修について相談する（無料）

基本操作｜@メンション・差分レビュー・権限モード

日常的に使う操作は3つに絞られます。文脈を渡す@メンション、変更内容を確認する差分レビュー、承認の粒度を決める権限モードです。

この3つを押さえれば、実務での使用に支障はありません。

@メンションでファイルを指定する

プロンプト欄で@に続けてファイル名やフォルダ名を入力すると、その内容をClaudeが読み取ります。部分的な入力でも候補が絞り込まれるため、正確なパスを覚えている必要はありません。

フォルダを指定したい場合は、末尾にスラッシュを付けます。大きなPDFでは、ページ範囲を指定して読ませることもできます。

エディタで範囲を選択した状態でショートカットキーを押すと、ファイル名と行番号を含む参照が挿入されます。特定の数行について質問したい場面で有効な操作です。

Mac：Option+K　／　Windows・Linux：Alt+K

渡す範囲は絞るほど結果が安定します。プロジェクト全体を読ませるより、関係するファイルだけを指定するほうが、余計な箇所を書き換えられる心配も減ります。

差分を確認してから承認する

ファイルの変更を提案する際、元の内容と変更後の内容が左右に並べて表示されます。内容を確認したうえで、承認する、拒否する、別の方針を伝えるという3つの選択肢から選べます。

差分の画面で直接手を加えることもできます。この場合、こちらが修正したことがClaude側にも伝わるため、元の提案どおりだと誤認したまま進む事態を避けられます。

承認を求められた際は、提示された内容に必ず目を通してください。読まずに許可を続ける使い方をすると、自動承認で進めているのと変わらない状態になります。

権限モードで承認の粒度を決める

プロンプト欄の下にあるモード表示から、承認の方法を切り替えられます。用意されているのは、都度確認するモード、計画を提示して承認を待つモード、編集を自動で進めるモードです。

初めて触るコードベースでは、都度確認するモードのまま進めるのが安全です。作業に慣れてきたら、任せる範囲を段階的に広げていきましょう。

計画を提示するモードでは、方針がマークダウンの文書として開かれます。ここに直接コメントを書き込んで方向性を修正できるため、規模の大きい改修で効果を発揮します。

指示の出し方で結果は大きく変わります。プロンプトの書き方をまとめた記事で精度を上げる基本の型を確認できます。

作業効率を上げる機能とショートカット

基本操作に慣れたら、周辺の機能にも目を向けてみてください。特に効果が大きいのは、セッション履歴、変更の巻き戻し、複数会話の並行実行の3つです。

順に紹介します。

セッション履歴から会話を再開する

パネル上部のボタンから、過去の会話にアクセスできます。キーワードで検索するほか、今日・昨日・過去7日間といった期間で絞り込めるため、以前の作業を探し出しやすい設計です。

新しい会話には内容に応じた名前が自動で付きます。名前は後から変更でき、不要なものは一覧から削除できます。

会話が長くなると、どの作業をどこで進めたかが曖昧になります。名前を付けて整理しておくと、後から振り返る際の手間が大きく変わってきます。

チェックポイントで変更を巻き戻す

拡張機能では、変更を過去の状態に戻す機能が使えます。会話の分岐だけを作る、ファイルの変更だけを戻す、両方まとめて戻すという3つの選択肢が用意されています。

意図しない方向に進んでしまったとき、最初からやり直さずに済みます。任せる範囲を広げる際の安全網として機能する仕組みです。

複数の会話を並行して進める

コマンドパレットから、新しいタブや別ウィンドウで会話を開けます。それぞれが独立した履歴と文脈を持つため、異なる作業を同時に進められます。

タブのアイコンには状態が色で示されます。承認待ちなのか、処理が終わったのかを、タブを切り替えずに把握できる仕組みです。

ひとつの作業の完了を待つ間に別の相談を進められるため、待ち時間の使い方が変わります。ただし数を増やしすぎると管理が煩雑になるので、二つか三つまでに留めるのが現実的です。

覚えておきたいショートカット

エディタとClaudeのパネルを行き来する操作は、頻度が高くなります。MacならCmd+Esc、WindowsとLinuxならCtrl+Escで、入力先を切り替えられます。

新しい会話をタブで開くショートカットや、閉じたセッションを開き直すショートカットも用意されています。すべてを覚える必要はなく、よく使うものから手に馴染ませていけば十分です。

チームでの活用を、属人化させずに広げませんか ネクストスケールでは、開発チーム向けのAI活用支援を提供しています。使い方の標準化からナレッジ共有の仕組みづくりまで、体制面からご相談いただけます。 ▶ チームでのAI活用について相談する（無料）

設定とカスタマイズ｜表示位置・ターミナルモード・MCP

設定を調整すると、自分の作業スタイルに合わせられます。扱えるのは、パネルの表示位置、起動時の権限モード、ターミナル形式への切り替えといった項目です。

主要なものを見ていきます。

パネルの表示位置を変える

パネルはドラッグで自由に移動できます。右側のサイドバーに置けばコードを書きながら常に見える状態になり、エディタ領域に置けばファイルと並ぶタブとして扱えます。

左側のサイドバーへの配置も可能です。好みの位置は記憶されるため、一度決めれば毎回設定し直す必要はありません。

モニターの大きさによっても最適な配置は変わります。作業環境が変わったタイミングで、一度見直してみると使い勝手が上がることがあります。

ターミナル形式に切り替える

標準ではグラフィカルなチャット画面が開きます。CLIの操作感を好む場合は、設定でターミナル形式に切り替えられます。

設定画面の拡張機能の項目から変更できます。両方を試してみて、自分に合うほうを選んでください。

設定ファイルは拡張機能とCLIで共有される

設定には2種類あります。VS Code側の設定は拡張機能の挙動を制御し、ホームディレクトリ配下の設定ファイルは拡張機能とCLIの両方で共有されます。

許可するコマンドや環境変数、フックといった内容は、共有される側で管理します。両方で同じ挙動にしたい設定は、こちらにまとめておくと管理が楽になります。

チームで使う場合は、共有される側の設定をリポジトリで管理する方法もあります。メンバーごとに挙動が違う状態を避けられるため、複数人での開発では検討する価値があります。

外部ツールとの連携

外部のツールやデータベースに接続する仕組みも利用できます。サーバーの追加は統合ターミナルからコマンドで行い、追加後の管理はチャット画面から操作するという役割分担になっています。

接続できているかどうかは、チャット画面から確認できます。認証情報に誤りがあると失敗の状態で表示されるため、設定直後に一度確認しておきましょう。

外部ツールと連携して自律的に動く仕組みに関心がある方は、AIエージェントの仕組みと活用法をまとめた記事が参考になります。

よくあるつまずきと注意点

導入時に発生しやすい問題は、原因がある程度決まっています。多いのは、アイコンが表示されない、サインインを求められ続ける、という2つのパターンです。

あわせて、運用上の注意点も確認しておきましょう。

アイコンが表示されない

エディタ右上のアイコンは、ファイルを開いているときにだけ表示されます。フォルダを開いただけの状態では出てこないため、まずファイルをひとつ開いてみてください。

それでも表示されない場合は、VS Codeのバージョンを確認します。1.94.0以上が必要なので、古い場合は更新が必要です。

他のAI拡張機能と競合している可能性もあります。一時的に無効化して確認するか、ウィンドウの再読み込みを試してください。制限モードのワークスペースでは動作しない点にも注意が必要です。

サインインを求められ続ける

環境変数にAPIキーを設定しているのにサインイン画面が出る場合、原因は環境の引き継ぎにあります。VS Codeがシェルの環境変数を受け取れていない状態なので、ターミナルからVS Codeを起動し直すと解決します。

アカウントでのサインインに切り替える方法もあります。個人利用であれば、こちらのほうが手順は簡単です。

組織の環境では、社内のネットワーク設定が影響している可能性もあります。個人の端末で問題なく動くのに社用端末で動かない場合は、この方向を疑ってみてください。

セキュリティ上の注意点

編集を自動承認する設定では、VS Code自身の設定ファイルも変更対象になり得ます。信頼できないコードを扱う際は、自動承認ではなく都度確認するモードを使ってください。

信頼していないワークスペースでは、VS Codeの制限モードを有効にする方法も案内されています。変更内容を確認してから承認する習慣とあわせて、運用側で守りを作っておきましょう。

公開できない情報を含むファイルがある場合は、読み取りを禁止する設定を用意しておくと安全です。選択範囲や開いているファイルの情報が意図せず渡ることを防げます。

設定項目や手順の詳細は、Claude Code公式ドキュメントのVS Code解説ページで確認できます。（出典：Anthropic）

扱うファイルの範囲を限定する運用も有効です。作業対象のフォルダだけを開いて起動すれば、関係のない領域まで読み取られる状況を避けられます。

最終確認は人が行う

提案されたコードが常に正しいとは限りません。一見動いていても、脆弱性を含んでいたり、非効率な処理になっていたりする場合があります。

差分の画面が用意されているのは、確認の工程を前提としているからです。承認ボタンを押す前に内容を読む習慣を、チーム全体で共有しておいてください。

社内での教育や定着の進め方については、生成AI研修の内容と進め方を解説した記事で詳しく紹介しています。

自社専用のツール開発を検討する段階なら、AI受託開発の依頼内容と費用相場の記事が判断の目安になります。

まとめ

Claude CodeのVS Code拡張機能は、コマンドを覚えずに画面上の操作で完結できる仕組みです。必要なのはVS Code 1.94.0以上と、Claudeの有料アカウントだけで、APIキーの発行は不要とされています。

導入は拡張機能ビューから検索してインストールするだけで済みます。発行元がAnthropicであることだけは、必ず確認してください。

日常的に使う操作は、@メンションで文脈を渡す、差分を確認して承認する、権限モードで任せる範囲を決めるという3つです。慣れてきたら、セッション履歴や巻き戻し、並行作業といった機能に広げていきましょう。

CLIにしかない機能が必要になったら、統合ターミナルから呼び出せば済みます。会話の履歴は共有されるため、どちらか一方に絞る必要はありません。

国内の生成AI利用状況については、総務省「令和8年版 情報通信白書（概要）」に個人・企業それぞれの調査結果がまとめられています。（出典：総務省）

AIを使った開発体制を、成果につながる形で整えませんか 株式会社ネクストスケールは、法人企業向けにAI研修・AI開発・AX推進支援を提供しています。何から着手すべきかの整理段階からご相談いただけます。 ▶ 無料相談を申し込む