Claude CodeをVS Codeで使う方法|拡張機能をインストールして、ターミナル版と使い分ける

Claude CodeをVS Codeで使うなら、Anthropic公式の拡張機能「Claude Code for VS Code」をインストールするのが手軽です。エディタで選択したコードや文章をそのまま渡して、質問や修正を依頼できます。

修正内容を確認してから反映したい場合は「Manual」、確認の回数を減らして作業を進めたい場合は「Auto」と、作業に合わせて動作モードを切り替えられます。ターミナル版のClaude Codeとも会話履歴や設定を共有できるため、必要に応じて同じ作業の続きをターミナルで進めることもできます。

目次

1.拡張機能とターミナル版、どちらで使うか

公式ドキュメントでは、拡張機能が「VS CodeでClaude Codeを使用する推奨方法」と案内されています。迷ったら、まず拡張機能から始めて大丈夫です。

違いは次のとおりです。

比べること 拡張機能(チャットパネル) ターミナル版(claudeコマンド)
画面 VS Codeの中にチャット画面が開く ターミナルに文字で表示される
選んだ行を渡す 選ぶだけで自動で伝わる VS Codeとつないでいれば伝わる
変更の確認 Manualモードなら元の内容と変更後を並べて表示 VS Codeとつないでいれば差分の画面が開く
使えるコマンドとスキル 一部(/を入力すると一覧が出る) すべて
!で始めるコマンドの実行 できない できる
Tabキーでの入力補完 できない できる
巻き戻し(チェックポイント) できる できる
インストール 拡張機能を追加するだけ 別にインストールが必要
Claude Codeの拡張機能とターミナル版の使い分けの図。ふだんは拡張機能でファイルを見ながら質問し、変更を目で確かめてから反映する。拡張機能にないコマンドを使うときはターミナル版。拡張機能をインストールしても、ターミナルでclaudeとは打てない
ふだんは拡張機能、足りないときはターミナル版

使い分けの目安は次の2つです。

  • ふだんの作業は拡張機能:ファイルを見ながら質問したい、変更を目で確かめてから反映したい、という使い方に向いています
  • ターミナル版が必要になるのは、拡張機能にないコマンドを使うとき:拡張機能で使えるコマンドは一部だけと、公式にも記載があります。足りないと感じたら、VS Codeのターミナルでclaudeを起動して続きを進められます(4章)

気をつけたいのは、拡張機能をインストールしても、ターミナルでclaudeと打てるようにはならない点です。拡張機能は自分用のClaude Codeを中に持っていて、ターミナルからは呼び出せません。ターミナル版も使うなら、公式のインストール手順で別にインストールしておきます。

2.拡張機能をインストールする

始める前に、次の2つがそろっているか確かめてください。

  • VS Codeのバージョンが1.94.0以上
  • Claudeの有料プラン(Pro、Max、Team、Enterprise)か、Claude Consoleのアカウント

拡張機能そのものはVS Code Marketplaceで無料と表示されていますが、使うにはどちらかのアカウントでサインインします。APIキーは必要ありません。

STEP
.拡張機能の画面で「Claude Code」を検索する

VS CodeでCmd+Shift+X(WindowsはCtrl+Shift+X)を押すと、左側に拡張機能の画面が開きます。検索欄に「Claude Code」と入力してください。

似た名前の拡張機能もあるので、名前が「Claude Code for VS Code」、発行元が「Anthropic」のものを選びます。識別子はanthropic.claude-codeです。

VS Codeの拡張機能の画面で「Claude Code」と検索した結果。発行元AnthropicのClaude Code for VS Codeが表示されている
発行元が「Anthropic」の「Claude Code for VS Code」を選ぶ
STEP
.「インストール」を押す

「インストール」を押すと、インストールが始まります。インストールしたのにアイコンが見当たらないときは、VS Codeを再起動するか、Cmd+Shift+Pでコマンドパレットを開いて「Developer: Reload Window」を実行してください。

VS Codeの拡張機能の画面で、インストール済みの一覧にClaude Code for VS Codeが表示されている
インストールが終わると「インストール済み」の一覧に表示される
STEP
.Claude Codeのパネルを開く

Claude Codeは、VS Codeの中ではSpark(光のマーク)のアイコンで表されます。開き方は次のどれでもかまいません。

  • ファイルを開いた状態で、エディタの右上にあるSparkアイコンを押す
  • ウィンドウ右下のステータスバーにある「✻ Claude Code」を押す(ファイルを開いていなくても使えます)
  • コマンドパレットで「Claude Code」と入力し、「Open in New Tab」などを選ぶ
STEP
.サインインする

はじめてパネルを開くと、サインインの画面が出ます。「Sign in」を押すとブラウザが開くので、そこで許可すればVS Codeに戻って使えるようになります。

サインインのあとに表示される「Learn Claude Code」のチェックリストは、基本の操作を順に試せる案内です。あとで見直したいときは、コマンドパレットの「Claude Code: Open Walkthrough」から開けます。

3.基本の使い方

ファイルや選んだ行を渡して質問する

エディタでコードや文章を選ぶと、Claude Codeは選んだ部分を自動で読み取ります。入力欄の下に、何行選んでいるかが表示されます。

選んだ部分を入力欄に書き込みたいときは、Option+K(WindowsはAlt+K)を押します。@app.ts#5-10のように、ファイル名と行番号が入ります。選んだ部分を渡したくないときは、表示の「X」を押すと外れます。

ほかのファイルやフォルダを指定するときは、@に続けて名前を入力します。

  • @authのように名前の一部だけでも、候補が出てきます
  • フォルダは@src/components/のように、最後に/を付けます
  • ターミナルの出力は@terminal:ターミナル名で渡せます。エラーメッセージをコピーして貼る手間を減らせます

画像は、コピーして入力欄に貼り付ければ渡せます。ファイルはShiftキーを押しながら入力欄へドラッグします。

なお、何も選んでいなくても、エディタで開いているファイルの名前はClaude Codeに伝わります。選んだ部分だけを伝えたいときは、5章の「Attach Open File」をオフにしてください。

作業に合わせてモードを切り替える

Claude Codeがファイルを編集するときの動きは、入力欄の下に表示されるモードで変更できます。

Claude Codeの入力欄の下にあるモード表示を押して開いたメニュー。Manual、Edit automatically、Plan、Autoの4つから選べる
入力欄の下のモード表示を押すと、4つのモードから選べる
モード 動き
Auto 多くの操作を、そのつど確認せずに進める。操作内容はClaude Code側の判定によって確認または停止される
Edit automatically ファイルの編集を確認なしで進める
Manual ファイルの編集や多くのコマンドを実行する前に確認する
Plan すぐに変更せず、最初に作業計画を提示する

公式ドキュメントによると、Claude Code v2.1.283以降は、何も設定していなければAutoで始まります。

自分で変更内容を確認しながら進めたい場合は「Manual」、確認の回数を減らして作業を進めたい場合は「Auto」を選びます。作業内容だけを整理したいときは「Plan」が向いています。

変更内容を一つずつ確認したい場合は「Manual」を選びます。元の内容と変更後が並んで表示されるため、差分を確認してから受け入れるか判断できます。

  • 変更ごとに「Accept this change」(受け入れる)か「Reject this change」(元に戻す)を押せます
  • ファイル全体をまとめて受け入れる、または元に戻すこともできます
  • 受け入れる前に、表示された変更後の内容を自分で直すこともできます

作業内容が決まっていて、確認の回数を減らして進めたい場合は「Auto」に切り替えます。Autoは「すべて無条件で実行するモード」ではなく、多くの操作について、ユーザーの代わりに分類機能が確認する仕組みです。危険性があると判断された操作では、確認を求められたり、実行が止まったりすることがあります(公式ドキュメント)。

公式ドキュメントでは、AutoやEdit automaticallyのように確認なしで編集できる状態だと、VS Codeの設定ファイル(settings.jsonやtasks.json)まで書き換えられることがあると注意しています。初めて使うフォルダや、外部から取得したコードを扱う場合はManualで確認し、内容を把握しているプロジェクトではAutoを使う、という分け方ができます。

前の状態に巻き戻す

送ったメッセージにマウスを重ねると、巻き戻しのボタンが出ます。選べるのは次の3つです。

  • ここから会話をフォークする:ファイルの変更はそのままで、この時点から別の会話を始める
  • ここまでコードを巻き戻す:会話は残したまま、ファイルだけをこの時点に戻す
  • 会話をフォークしてコードを巻き戻す:別の会話を始め、ファイルもこの時点に戻す

「さっきの状態に戻してやり直したい」ときは、2つ目の「ここまでコードを巻き戻す」を選びます。

過去の会話を開く

パネル上部の「Session history」ボタンから、過去の会話を開けます。キーワードで探すこともできます。14日間動きのない会話は、基本的に「Archived sessions」へ自動で移ります。ただし、現在開いている会話、未読の会話、グループに入れている会話は対象外です。アーカイブされても削除されたわけではなく、一覧から開き直せます。

別の作業を同時に進めたいときは、コマンドパレットの「Open in New Tab」で会話をもう1つ開けます。会話ごとに履歴は分かれています。

4.ターミナル版と行き来する

拡張機能とターミナル版が、会話の履歴と設定ファイルsettings.jsonを共有している図。claude --resumeで拡張機能の会話の続きをターミナルで開ける
拡張機能とターミナル版は、会話の履歴と設定を共有している

VS Codeのターミナルでclaudeを起動する

拡張機能にないコマンドを使いたいときは、VS Codeの中でターミナル版に切り替えます。Cmd+`(WindowsはCtrl+`)でターミナルを開き、claudeと入力してください。ターミナル版を別にインストールしていることが前提です。

VS Codeの中のターミナルで起動すると、ターミナル版もVS Codeと自動でつながります。変更の差分がVS Codeの画面で開き、エディタで選んだ行も伝わります。

Macの「ターミナル」アプリなど、VS Codeの外で起動したときは、Claude Codeの中で/ideと入力するとVS Codeにつながります。

拡張機能の会話をターミナルで続ける

拡張機能とターミナル版は、同じ会話の履歴を使います。拡張機能で始めた会話をターミナルで続けたいときは、次のコマンドを実行します。

claude --resume

会話の一覧が出るので、続けたいものを選びます。ターミナルを開いたフォルダ(プロジェクト)で実行してください。

設定ファイルは共通

許可したコマンドや、外部ツールとの接続(MCPサーバー)などの設定は、設定ファイル(settings.json)に記載します。この設定は拡張機能とターミナル版で共通です。どちらで使っても同じ設定が効くので、2か所に分けて設定する必要はありません。

5.はじめに見ておきたい設定

拡張機能の設定は、Cmd+,(WindowsはCtrl+,)で設定画面を開き、「Extensions(拡張機能)」→「Claude Code」から変えられます。

設定 最初の状態 変えると
Initial Permission Mode 未設定 新しい会話をどのモードで始めるかを決められる。毎回Manualで始めたいときに使う
Preferred Location panel Claudeを開く場所。panel(エディタのタブ)かsidebar(横のサイドバー)
Use Ctrl Enter To Send オフ オンにすると、Cmd+Enterで送信、Enterで改行になる
Attach Open File オン オフにすると、開いているファイルは伝えず、選んだ部分だけを伝える
Autosave オン Claudeがファイルを読み書きする前に、自動で保存する
Use Terminal オフ オンにすると、拡張機能のままターミナル版と同じ画面で開く

長い指示を何行かに分けて書きたいときは、「Use Ctrl Enter To Send」をオンにしておくと、Enterで改行しながら書けます。初期設定のままでも、Shift+Enterで改行できます。

また、拡張機能のバージョン番号は、中に入っているClaude Codeのバージョンと同じです。公式ドキュメントには「v2.1.286以降が必要」のように、新しい版でしか使えない機能も載っています。説明どおりのボタンが見当たらないときは、拡張機能の画面でバージョンを確かめて、更新してみてください。

6.うまく動かないとき

困っていること 確かめること
Sparkアイコンが出ない ファイルを1つ開く(フォルダを開いただけでは出ない)。右下の「✻ Claude Code」からも開ける
拡張機能が動かない VS Codeを1.94.0以上にして、「Developer: Reload Window」で再読み込み
それでも動かない ほかのAI系の拡張機能を一時的に止める。ワークスペースを信頼しているかも確かめる
「Not logged in · Please run /login」と出る サインイン画面が自動で開かないときは「Developer: Reload Window」
MacでCmd+Escが効かない macOSのGame Overlayを外す(表の下で説明)
返事が来ない インターネット接続を確かめ、新しい会話で試す。ターミナルでclaudeを起動すると、詳しいエラーが出ることがある

制限モード(ワークスペースを信頼していない状態)では、拡張機能は動きません。フォルダを開いたときに信頼を確認する画面が出たら、自分のフォルダであることを確かめてから信頼してください。

Cmd+Escは、エディタとClaude Codeの入力欄を行き来するキーです。macOS Tahoe以降では、システムのGame Overlayが初期設定で同じキーを使っているため、VS Codeまで届かないことがあります。システム設定のキーボードショートカット(Game Controllers)でGame Overlayのチェックを外すか、VS Codeのキーボードショートカットで「Claude Code: Focus input」に別のキーを割り当ててください。

まとめ|拡張機能で始めて、足りないときはターミナルへ

VS CodeでClaude Codeを使うなら、まずはAnthropic公式の拡張機能をインストールします。選択したコードや文章をそのまま渡せるほか、変更内容をVS Code上で確認できます。

変更を一つずつ確認したい場合は「Manual」、確認の回数を減らして作業を進めたい場合は「Auto」を選びます。最初に作業内容を整理してから進めたい場合は「Plan」も利用できます。

ターミナル版は別途インストールが必要ですが、拡張機能と会話履歴を共有できます。拡張機能にないコマンドを使いたいときや、ターミナル上で作業したいときは、claude --resumeで会話の続きを開けます。

はじめて使う場合は、まずManualで小さな修正を依頼し、確認の流れに慣れてからAutoへ切り替えると使い分けが分かりやすくなります。

この記事が気に入ったら
フォローしてね!

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次