Claude CodeのVS Code拡張でREADMEを説明させる — 最初の1タスクを10分で動かす
VS Codeを使っていて、AIエージェントをまだ動かしたことがない方向けです。
この記事ではClaude CodeのVS Code拡張から、練習用READMEのStatus: readyを説明させます。
前提はVS Code 1.94.0以上と、利用可能なClaudeまたはAnthropic Consoleのアカウントです。
この記事の更新日は2026年9月8日です。画面や要件は変わることがあるので、最後に載せた公式ドキュメントも合わせて確認してください。
今日できるようになること
ゴールは、VS Codeの中でClaude Codeへ次の依頼を1回送り、練習用READMEの内容を回答してもらうことです。
README.mdを読んでください。Statusの値と、その意味を日本語で1文だけ説明してください。ファイルは変更しないでください。
成功したかどうかは、回答に次の2点が含まれていれば判断できます。
-
Statusの値がreadyである -
readyは「準備完了」の意味だと説明されている
文章が完全に同じである必要はありません。まずは「AIがファイルを読み、質問に沿って答えた」と目で確認できれば十分です。
Claude CodeのVS Code拡張とは
Claude Codeは、ファイルを読み、必要に応じて編集やコマンド実行まで行えるAIエージェントです。AIエージェントとは、質問に答えるだけでなく、与えられた目的に向けてツールを使いながら作業できるAI、と考えると分かりやすいです。
今回使うVS Code拡張は、そのClaude Codeをエディタの横にあるチャットパネルから使う機能です。VS Codeは、コードや文章ファイルを編集するアプリです。拡張機能を追加すると、編集中の画面を離れずにClaudeへ相談できます。
公式ドキュメントによると、拡張のチャットパネルにはClaude CodeのCLIが同梱されています。CLIは「ターミナルで文字を打って操作する方式」のことです。そのため、今回のパネル操作だけなら、ターミナル用のclaudeコマンドを別に入れる必要はありません。
一方、VS Code内のターミナルでclaudeコマンドを直接使いたい場合は、スタンドアロン版CLIの導入が別途必要です。ここは混同しやすいところなんですよね。この記事ではチャットパネルだけを使います。
始める前の確認
公式の前提条件は次のとおりです。
- VS Code 1.94.0以上
- Claude Pro、Max、Team、Enterpriseのいずれか、またはAnthropic Consoleのアカウント
- 初回にブラウザでサインインできること
VS Codeのバージョンは、メニューの「Code」または「Help」から「About」を開いて確認できます。1.94.0未満なら、先にVS Codeを更新してください。
なお、この記事では実際のプロジェクトを使いません。機密情報や大切なファイルを誤って渡さないよう、空の練習フォルダを作ります。最初の一歩は小さい方が、失敗した時に原因を見つけやすいです。
手順1: Claude Code拡張をインストールする
VS Codeを開き、次の順に進みます。
- macOSは
Cmd+Shift+X、WindowsとLinuxはCtrl+Shift+Xを押す - Extensions（拡張機能）の検索欄へ
Claude Codeと入力する - 提供元がAnthropicの「Claude Code」を選ぶ
-
Installを押す
インストール後に拡張が見えない場合、公式はVS Codeの再起動、またはCommand PaletteからDeveloper: Reload Windowを実行する方法を案内しています。
Command Paletteは、VS Codeの機能名を検索して実行する入口です。macOSはCmd+Shift+P、WindowsとLinuxはCtrl+Shift+Pで開けます。
手順2: 練習フォルダとREADMEを作る
ここだけは、コピーして同じ素材を用意します。macOSまたはLinuxのターミナルで次を実行してください。
mkdir -p ~/claude-vscode-practice
cd ~/claude-vscode-practice
printf '# Practice Project\n\nStatus: ready\n' > README.md
Windows PowerShellでは次を使えます。
$practice = Join-Path $HOME "claude-vscode-practice"
New-Item -ItemType Directory -Force -Path $practice | Out-Null
Set-Location $practice
"# Practice Project`n`nStatus: ready" | Set-Content -Encoding utf8 README.md
その後、VS Codeでclaude-vscode-practiceフォルダを開き、README.mdをクリックします。内容が次の3行なら準備完了です。
# Practice Project
Status: ready
このファイルはダミーデータです。公開して困る情報を含みません。実案件のファイルへ進む前に、安全な素材で操作を覚えます。
手順3: Claude Codeパネルを開く
READMEを開いた状態で、エディタ右上のSparkアイコンを押します。公式ドキュメントでは、このアイコンはファイルを開いている時に表示されると説明されています。
見つからない場合は、Command Paletteを開いてClaude Codeと入力し、Open in New Tabを選んでください。左側のActivity BarにあるSparkアイコンからセッション一覧を開く方法もありますが、今回は覚える入口を増やさず、右上アイコンかCommand Paletteのどちらかで進めれば大丈夫です。
初回はサインイン画面が表示されます。Sign inを押し、ブラウザで認証を完了します。アカウントや認証画面に問題が出た場合は、無理に何度も押さず、後述のつまずきポイントへ進んでください。
手順4: Manual modeで最初の1タスクを送る
Claude Codeパネルの権限モードをManual modeにします。権限モードは、Claudeがどこまで自動で作業してよいかを決める設定です。
公式ではAutoやEdit automaticallyのモードは、ワークスペース内のファイルを確認なしで編集する場合があると説明されています。今日は読み取り体験だけなので、Manual modeから始めます。
入力欄へ次の文章を貼り付けて送信します。
README.mdを読んでください。Statusの値と、その意味を日本語で1文だけ説明してください。ファイルは変更しないでください。
回答例は次のような形です。
Statusの値はreadyで、準備完了を意味します。
これは期待する形を示した例であり、筆者環境で同じ回答を実測したものではありません。AIの文章には揺れがあります。ただし、readyと「準備完了」の2点が含まれていれば、今日の成功条件は満たしています。
最後にREADMEを見直し、内容が変わっていないことも確認してください。
筆者が確認した範囲
2026年9月8日に、Claude Code公式のVS Codeページと概要ページを読み、次を照合しました。
- VS Code 1.94.0以上という要件
- 拡張の導入手順、パネルの開き方、初回サインイン
- 拡張のチャットパネルにはCLIが同梱されること
- AutoまたはEdit automaticallyでは、ワークスペース内の多くのファイルを確認なしで編集しうること
手元ではclaude --versionを実行し、2.1.263 (Claude Code)と表示されることを確認しました。練習READMEを作るシェル構文も確認済みです。
一方、筆者環境にはVS Code本体とClaude Code拡張が入っていないため、今回のGUI操作とモデル回答は動作未確認です。画面操作については公式手順の再構成であり、実行済みの体験としては書いていません。
つまずきポイント
1. 検索しても拡張をインストールできない
まずVS Codeが1.94.0以上か確認します。会社管理の端末では拡張機能の導入が制限されている場合もあります。その時は管理者のルールを優先してください。
2. インストール後にSparkアイコンが見えない
READMEなどのファイルを1つ開きます。それでも見えなければVS Codeを再起動するか、Command PaletteでDeveloper: Reload Windowを実行します。その後、Claude Code: Open in New Tabを検索します。
3. サインイン画面が進まない
ブラウザで認証を最後まで完了したか確認します。パネルにNot logged in · Please run /loginと出る場合、公式はVS Codeのウィンドウ再読み込みも案内しています。会社のネットワークや認証制限がある場合は、組織の管理者へ確認してください。
4. ClaudeがREADMEを見つけられない
VS Codeで開いているのがファイル単体ではなく、claude-vscode-practiceフォルダであるか確認します。ExplorerにREADME.mdが見えている状態へ戻してから、もう一度同じ依頼を送ります。
5. ファイル変更の確認が表示された
依頼文に「ファイルは変更しないでください」と書いても、権限設定の代わりにはなりません。Manual modeになっているか確認し、意図しない編集は承認しないでください。
6. 回答が例文と完全に一致しない
AIの文章は毎回同じとは限りません。文字列の完全一致ではなく、readyと「準備完了」の意味が含まれるかを確認します。違う値が返ったら、実際のREADME内容と開いているフォルダを見直します。
7. ターミナルでclaudeが見つからない
今回のチャットパネルと、ターミナル用CLIは別です。公式によると、拡張はパネル用CLIを同梱しますが、シェルのPATHへclaudeを追加しません。ターミナルで使う時だけ、スタンドアロン版CLIを別途導入します。
限界と、別の方法が向く人
VS Code拡張を入れたからといって、回答が常に正しいとは限りません。重要な変更や判断は、人が差分と実行結果を確認する必要があります。今回は読み取りだけですが、実案件では秘密情報を含むファイルを安易に渡さないことも大切です。
また、普段VS Codeを使わない人には、この方法は遠回りです。ターミナル操作に抵抗がなく、CLIだけで作業したいなら、Claude Codeのターミナル版を使う方が短く済みます。無料で読める公式Quickstartだけでも最初の起動はできます。
逆に、普段からVS Codeでファイルを開いている人には、編集画面の横で質問できることが価値になります。どちらが優れているかではなく、いつもの作業場所に近い方を選ぶ。なんかそれくらいの始め方が、続けやすい気がします。
よくある質問
最初から実際のリポジトリを開いてもよいですか
可能ですが、初回は練習フォルダをおすすめします。リポジトリは、コードや変更履歴をまとめて管理するプロジェクト置き場です。実案件には設定値や未公開情報が含まれることがあるため、まず公開して困らないダミー素材で権限と画面を確認してください。
README以外も読ませられますか
読ませられます。ただし、この記事のゴールはREADMEを1回読むことだけです。次のファイルへ広げる前に、開いているフォルダと送ってよい情報を自分で確認してください。
料金はかかりますか
公式は利用資格として有料ClaudeプランまたはAnthropic Consoleアカウントを案内しています。実際の請求方法や利用上限は契約で変わるため、この記事では金額を断定しません。最新の料金ページと自分の契約画面を確認してください。
まとめ
今日の手順は、Claude CodeのVS Code拡張を入れ、Manual modeでダミーREADMEを読ませる1タスクでした。
最初から大きなコード変更を任せなくても大丈夫です。Status: readyの意味を1文で返してもらう。それだけでも「AIエージェントが自分のファイルを読み、目的に沿って答える」という最初の体験になります。
次の1アクションは、claude-vscode-practiceフォルダで、この記事の依頼文を1回だけ送ることです。10分で終わる小ささから始めてみてください。
参考リンク
生成AI活用エンジニア&3児のパパ。AI×開発の実践知を毎日発信しています → Xで次の実践例を見る