2026年9月19日 / 最終更新日 : 2026年9月20日ふじながただしコラム

Claude CodeをVS Codeで使う方法｜連携・使い方・CLIとの違いを解説

Claude CodeをVS Codeで使いたい方が増えています。

しかし、「Claude CodeとVS Codeは何が違うの？」「VS Codeの拡張機能を入れる必要がある？」「Claude CodeのCLI版とVS Code版は何が違う？」「CLAUDE.mdはVS Codeでも使える？」など、分かりにくい点もあります。

現在のVS Codeでは、AnthropicのClaudeをエージェントハーネスとして利用できます。ClaudeのエージェントセッションをVS CodeのChat画面から実行し、プロジェクトのファイルを調査したり、コードを変更したり、コードレビューを行ったりできます。

また、VS CodeはCLAUDE.mdを自動検出し、Claude CodeなどのClaude系ツールと共有できるプロジェクト指示として利用できます。

この記事では、Claude CodeとVS Codeの関係から、実際の使い方、CLI版との違い、CLAUDE.mdの設定、GitHubとの連携まで初心者向けに解説します。

Claude Codeとは？

Claude Codeは、Anthropicが提供するAIコーディングエージェントです。

一般的なAIチャットでは、質問に対してコードを生成してもらう使い方が中心です。

一方、Claude Codeはプロジェクトのファイルを調査し、コードを編集したり、コマンドを実行したり、テストしたりするなど、ソフトウェア開発そのものを支援できます。

例えば、次のような作業を依頼できます。

プロジェクトの構造を調査する
既存コードの問題を調べる
新しい機能を追加する
複数のファイルを修正する
テストコードを作成する
エラーの原因を調査する
コードをリファクタリングする
Gitの変更内容を確認する
Pull Requestをレビューする

VS Codeとは？

VS Code（Visual Studio Code）は、Microsoftが提供するコードエディタです。

Windows、macOS、Linuxで利用でき、コード編集だけでなく、ターミナル、Git、デバッグ、拡張機能など、プログラミングに必要な機能をまとめて利用できます。

現在のVS CodeにはAIエージェントを利用するための仕組みもあり、Claude、GitHub Copilot、Codexなどのエージェントハーネスを選択できます。

Claude CodeとVS Codeの違い

Claude CodeとVS Codeは、そもそも役割が違います。

項目	Claude Code	VS Code
提供元	Anthropic	Microsoft
種類	AIコーディングエージェント	コードエディタ・開発環境
主な役割	AIによる開発作業	コード編集・実行・デバッグなど
Git	AIから操作・支援可能	Git機能を利用可能
ターミナル	開発コマンドを実行可能	統合ターミナルを搭載
AIエージェント	Claude	Claudeなど複数のエージェントを利用可能

つまり、単純に「Claude CodeとVS Codeのどちらを選ぶか」という話ではありません。

VS Codeという開発環境の中で、Claudeをエージェントとして利用するという使い方ができます。

VS Codeの「エージェントハーネス」とは？

ここは、現在のVS Codeを理解するうえで重要なポイントです。

VS Codeでは、AIエージェントを動かす仕組みをエージェントハーネス（Agent Harness）と呼んでいます。

エージェントハーネスは、AIエージェントのセッションを管理し、ツールの呼び出し、コンテキスト、コード変更などを調整する仕組みです。

VS CodeではClaude、GitHub Copilot、Codexなどをエージェントハーネスとして選択できます。

つまり、VS Codeは単なるコードエディタから、複数のAIエージェントを利用できる開発環境へと機能を広げています。

Claudeを選択した場合、VS CodeはClaude Agent SDKを利用してClaudeのエージェントセッションを実行します。

Claude CodeをVS Codeで使う方法

1．VS Codeをインストールする

まずVS Codeをインストールします。

Windows、macOS、Linuxに対応しています。

2．プロジェクトを開く

Claudeに作業を依頼したいプロジェクトをVS Codeで開きます。

例えばターミナルから以下のコマンドで現在のフォルダをVS Codeで開けます。

code .

Claudeエージェントは現在のワークスペースを対象として作業できます。

3．VS CodeのChatを開く

VS CodeのChat画面を開きます。

新しいChatセッションを作成し、セッションタイプからClaudeを選択します。

現在のVS Codeでは、Claudeをローカルで実行するセッションと、クラウド上で実行するパートナーエージェントの仕組みがあります。

4．Claudeを選択する

Claudeを選択すると、ClaudeのエージェントセッションをVS Code上で開始できます。

Claudeのセッションでは、Claude固有のスラッシュコマンドや権限設定なども利用できます。

5．Claudeに作業を依頼する

例えば次のように依頼できます。

このプロジェクトの構成を調査してください。
主要なファイルと、それぞれの役割を説明してください。

最初からコードを書かせるのではなく、まず調査や計画を依頼する方法もあります。

このプロジェクトにログイン機能を追加する場合の
実装方法を調査して、変更するファイルと手順を説明してください。
まだファイルは変更しないでください。

このように、計画を確認してから実装に進むことができます。

Claudeの権限設定も重要

Claudeエージェントでは、コードの変更などをどのように許可するかを設定できます。

現在のVS Codeでは、Claudeについて次のような権限モードがあります。

自動的に編集する
変更前に承認を求める
まず計画だけを作成する

初めて使う場合は、いきなり自動編集させるのではなく、まずPlanで計画を確認し、その後に実装させる方法が分かりやすいでしょう。

既存の重要なプロジェクトでは、変更前に承認を求める設定にして、Gitの差分も確認することをおすすめします。

Claude CodeをVS Codeのターミナルから使う方法

Claude Codeにはターミナルから利用する方法もあります。

VS Codeには統合ターミナルがあるため、VS Codeの中からClaude Code CLIを起動することもできます。

claude

この方法では、

上側でコードを編集する
下側のターミナルでClaude Codeを操作する
Claude Codeにファイルを変更させる
VS Codeで変更内容を確認する

という開発スタイルができます。

VS CodeのClaudeとClaude Code CLIの違い

項目	VS CodeのClaude	Claude Code CLI
操作画面	VS CodeのChat	ターミナル
コード編集	VS Codeと一体化	任意のエディタと組み合わせ可能
Claudeエージェント	利用可能	利用可能
Git	利用可能	利用可能
スラッシュコマンド	Claudeのコマンドを利用可能	Claude Codeのコマンドを利用可能
向いている使い方	VS Code中心の開発	ターミナル中心の開発

重要なのは、VS Code版とCLI版を完全に別のAIとして考える必要はないということです。

VS CodeではClaudeのエージェント機能をVS Codeの開発環境に統合して利用できます。

CLAUDE.mdとは？

CLAUDE.mdは、Claude CodeなどのClaude系ツールにプロジェクト固有のルールや指示を伝えるためのファイルです。

例えば、次のようなルールを書いておけます。

# プロジェクト開発ルール

- Python 3.12を使用する
- 関数には型ヒントを付ける
- テストにはpytestを使用する
- 新しい機能にはテストを追加する
- 既存APIの仕様を変更しない
- コメントは日本語で記述する

これをプロジェクトのCLAUDE.mdに保存しておくことで、Claude Codeにプロジェクト固有のルールを伝えられます。

VS CodeでもCLAUDE.mdが使える

ここが「Claude Code VS Code」というキーワードで記事を作るうえで重要なポイントです。

VS Codeは現在、CLAUDE.mdを自動的に検出し、常時適用される指示として利用できます。

VS Codeが検索する場所には、例えば次のようなものがあります。

ワークスペースのルートにあるCLAUDE.md
.claude/CLAUDE.md
ユーザーホームの~/.claude/CLAUDE.md
ローカル専用のCLAUDE.local.md

つまり、Claude CodeとVS Codeを併用する場合、CLAUDE.mdをプロジェクトの共通ルールとして利用することができます。

CLAUDE.mdの設定例

例えばPythonプロジェクトなら、次のようなCLAUDE.mdを作成できます。

# Pythonプロジェクト

## 開発環境

- Python 3.12
- pytest
- Ruff

## コーディングルール

- 型ヒントを使用する
- 1関数1責務を基本とする
- 新機能にはテストを追加する
- 既存の公開APIを変更しない

## テスト

コードを変更したら、関連するpytestを実行してください。

Claudeに毎回同じルールを説明する必要がなくなるため、AIを使った開発を継続する場合に便利です。

CLAUDE.mdとVS Codeの設定ファイルは違う

VS Codeには、AIエージェント向けの複数の指示ファイルがあります。

ファイル	主な用途
CLAUDE.md	Claude系ツールとの共通ルール
AGENTS.md	複数のAIエージェントで共有する指示
.instructions.md	特定のファイルやパターンに適用する指示
.github/copilot-instructions.md	GitHub Copilot向けのプロジェクト指示

複数のAIエージェントを利用する場合は、どの指示ファイルをどのエージェントが利用するのかを整理しておくことが重要です。

VS CodeでClaudeのスラッシュコマンドを使う

Claudeのセッションでは、チャット入力欄に/を入力すると、利用可能なClaude固有のコマンドを確認できます。

例えば現在のVS Codeでは、次のようなコマンドがあります。

/agents：サブエージェントの管理
/hooks：フックの設定
/memory：CLAUDE.mdなどのメモリー管理
/init：CLAUDE.mdの初期化
/review：コードレビュー
/security-review：セキュリティレビュー

特に/initは、既存プロジェクトでClaude Codeを使い始める際に便利な機能です。

Claude Code・VS Code・GitHubを組み合わせる

Claude Code、VS Code、GitHubを組み合わせると、AIを利用した開発フローを構築できます。

GitHubからプロジェクトを取得
VS Codeでプロジェクトを開く
CLAUDE.mdで開発ルールを設定
Claudeにプロジェクトを調査させる
Claudeに機能追加を依頼する
VS Codeで変更内容を確認する
テストを実行する
Gitでコミットする
GitHubへプッシュする
Pull Requestをレビューする

Claude CodeとGitHubの連携について詳しく知りたい方は、以下の記事も参考にしてください。

Claude CodeとGitHubを連携する方法

Claude CodeをVS Codeで使うときの注意点

AIが変更したコードを確認する

Claudeは複数のファイルを変更できます。

そのため、AIが変更した内容をVS Codeの差分表示などで確認してからコミットすることが重要です。

重要なプロジェクトでは承認を有効にする

AIエージェントにすべての操作を自動で許可するのではなく、重要なファイルやコマンドについては承認を求める設定にする方法があります。

APIキーをGitHubに公開しない

Anthropic APIキーなどの秘密情報をソースコードに直接記述しないようにしましょう。

GitHubへプッシュするコードにAPIキーを含めないことも重要です。

Claude CodeとVS Codeを使ったAIプログラミングの流れ

初心者の場合は、次の流れで練習すると分かりやすいでしょう。

VS Codeで小さなプロジェクトを作る
Claudeにプロジェクト構成を説明してもらう
CLAUDE.mdを作成する
Claudeに小さな機能追加を依頼する
変更されたコードをVS Codeで確認する
テストを実行する
エラーがあればClaudeに修正を依頼する
Gitで変更を管理する

最初から大規模なアプリケーションをAIに作らせるよりも、小さな機能を依頼して、変更内容を確認するところから始めると、Claude Codeの仕組みを理解しやすくなります。

JetBrains系IDEでも使える

VS Code以外に、JetBrains系のIDE向けにもプラグインが提供されています。エディタを変えずにClaude Codeを組み込みたい場合の選択肢です。

対応IDE
IntelliJ IDEA
PyCharm
Android Studio
WebStorm
PhpStorm
GoLand

インストールは2段階

ここを誤解しやすいので先に書きます。JetBrainsのプラグインはCLIを同梱していません。プラグインはIDEの統合ターミナルで claude コマンドを実行して接続する仕組みなので、両方入れる必要があります。

Claude Code本体（CLI）をインストールする — 手順は環境構築の記事を参照
JetBrainsマーケットプレイスからプラグインを入れて、IDEを再起動する

claude がPATHに無いと「Cannot launch Claude Code」という通知が出ます。その場合はプラグイン設定でコマンドのフルパスを指定してください。

できること

機能	内容
差分表示	変更をIDEの差分ビューアで開く。ターミナル表示に戻すことも可能
選択範囲の共有	いま選択している箇所や開いているタブが自動的に共有される
ファイル参照	ショートカットで `@src/auth.ts#L1-99` の形の参照を挿入できる
診断の読み取り	IDEが出しているlintや構文エラーをClaudeが読める
クイック起動	`Cmd+Esc`（Mac）/ `Ctrl+Esc`（Windows・Linux）

外部のターミナルから使っている場合は、/ide と打つとIDEに接続できます。接続に成功すると Connected to IntelliJ IDEA. のように表示されます。

選択範囲の共有には注意点がある

接続中は、いま選択しているテキストと開いているファイルのパスが、毎回の依頼に付いて送られます。便利な反面、機密ファイルを開いたまま作業すると意図せず共有されます。

.env のようなファイルを除外したい場合は、権限ルールでReadを拒否してください。拒否したファイルは選択範囲も送られなくなります。

{
  "permissions": {
    "deny": ["Read(./.env)", "Read(./secrets/**)"]
  }
}

JetBrainsで使うときのセキュリティ上の注意

公式ドキュメントが明記している点です。編集を自動承認するモードで動かすと、IDEの設定ファイルまで書き換えられる可能性があります。IDEの設定ファイルには自動実行される仕組みがあるため、結果として権限確認を回避されうる、という指摘です。

JetBrains系で使う場合は、編集を都度確認するモードで運用するのが安全です。権限モードの違いはClaude Codeのセキュリティで解説しています。

WSLで「IDEが見つからない」と出る場合

WSL2のネットワーク構成が原因です。Windows側で動くIDEとWSL2の間の通信が、NATとファイアウォールに阻まれています。ファイアウォールで許可を出すか、WSL2をミラーモードのネットワークに切り替えると解決します。

CLI・VS Code拡張・JetBrainsプラグインの使い分け

	向いている場面
ターミナル（CLI）	長時間の作業、自動化、エディタを開かない作業
VS Code拡張	VS Codeで書きながら、差分をGUIで確認したい
JetBrainsプラグイン	JetBrains系IDEから離れたくない

いずれも同じClaude Codeなので、設定ファイルや権限ルールは共通です。使い分けても、CLAUDE.mdやスキルはそのまま効きます。日常的な操作はClaude Code コマンド一覧を参照してください。

Claude Code VS Codeに関するよくある質問

Claude CodeはVS Codeで使えますか？

はい。現在のVS CodeではClaudeをエージェントハーネスとして利用できます。また、VS Codeの統合ターミナルからClaude Code CLIを利用する方法もあります。

Claude Codeを使うためにVS Codeの拡張機能は必要ですか？

現在のVS CodeではClaudeエージェントをセッションタイプとして利用できます。そのため、「Claude Code専用の従来型拡張機能を入れなければ使えない」という単純な仕組みではありません。

Claude CodeとVS Codeはどちらを使えばいいですか？

役割が違うため、どちらか一方を選ぶ必要はありません。VS Codeを開発環境として使い、その中でClaudeをAIエージェントとして利用できます。

CLAUDE.mdはVS Codeでも使えますか？

はい。VS CodeはCLAUDE.mdを自動検出し、Claude CodeなどのClaude系ツールと共有できるプロジェクト指示として利用できます。

Claude Code CLIとVS CodeのClaudeは同じですか？

利用する画面や統合方法は異なります。CLIはターミナル中心、VS CodeではChat画面を中心にClaudeのエージェント機能を利用できます。

まとめ

Claude CodeとVS Codeを組み合わせることで、AIを活用したプログラミング環境を構築できます。

VS Codeはコード編集を中心とした開発環境
ClaudeはAIエージェントとしてVS Codeから利用できる
VS CodeではClaudeをエージェントハーネスとして利用できる
Claude Code CLIをVS Codeの統合ターミナルから利用する方法もある
CLAUDE.mdをプロジェクトの開発ルールとして利用できる
ClaudeのスラッシュコマンドもVS CodeのClaudeセッションから利用できる
Git・GitHubと組み合わせることでAI開発の幅を広げられる
AIが変更したコードは人間が確認することが重要

Claude Codeをこれから始める場合は、まず基本的な使い方を理解し、その後にVS Code、CLAUDE.md、Git、GitHubを組み合わせていくと、AIを使ったプログラミングを実践しやすくなります。

テックジムでは、Claude Codeを実際に操作しながら学べる無料・対面の初心者向け講座も開催しています。

Claude Codeとは？使い方・できること

Claude Codeの環境構築方法