AIコーディングガイド

Claude Code VS Code 拡張のインストールと初期設定【最初に見直したい 5 項目】

Claude Code 公開:

Claude Code を VS Code で使うための拡張機能のインストール手順、ログイン方法、CLI との関係、最初に見直したい設定を公式ドキュメントに沿って解説します。

検証日 2026年9月7日 仕様変更が早い分野です。最新の公式ドキュメントも併せてご確認ください。
#Claude Code#VS Code#インストール#初期設定
目次
  1. 前提条件
  2. インストール手順
  3. CLI もあわせて入れておく
  4. 導入直後に見直したい 5 項目
    1. 1. 権限モードを決める
    2. 2. CLAUDE.md を作る
    3. 3. モデルを確認する
    4. 4. 差分の確認方法を決める
    5. 5. 秘密情報の読み取りを禁止する
  5. よくあるつまずき
  6. まとめ

Claude Code は Anthropic が提供するコーディングエージェントで、ターミナルからも VS Code のサイドパネルからも使えます。この記事では、VS Code 拡張機能を入れてから最初のタスクを実行するまでの手順と、導入直後に見直しておくと後で困らない設定をまとめます。

結論から書くと、拡張機能をインストールしてログインすれば数分で使い始められます。ただし、権限モードと CLAUDE.md を最初に整えておくかどうかで、その後の使い勝手が大きく変わります。

KEY POINT

この記事で分かること

  • VS Code 拡張のインストールとログインの手順
  • ターミナル版(CLI)との関係と、両方入れるべき理由
  • 導入直後に見直したい 5 つの設定

前提条件

項目内容
VS Code最近の安定版(Cursor、Windsurf などの派生エディタも可)
アカウントClaude Pro / Max / Team / Enterprise のいずれか、または Anthropic Console の API キー
OSmacOS、Linux、Windows(ネイティブ対応。詳細は Windows で Claude Code を使う)
Gitリポジトリ操作をさせるなら必須

無料プランの Claude アカウントでは Claude Code は利用できません。個人で試すなら Pro プラン、業務でヘビーに使うなら Max プランが一般的です。料金の考え方は Claude Code の料金と使用量の確認方法 にまとめています。

インストール手順

  1. VS Code の拡張機能ビュー(Ctrl+Shift+X / Cmd+Shift+X)を開きます。
  2. 「Claude Code」で検索し、発行元が Anthropic の拡張機能をインストールします。
  3. インストール後、アクティビティバーに Claude のアイコンが追加されます。クリックするとサイドパネルが開きます。
  4. 「Sign in」を押すとブラウザが開くので、Claude アカウントでログインします。API キーで使う場合は、設定画面から Anthropic Console のキーを入力します。
  5. 開いているワークスペースを対象に、最初の指示を入力します。例:「このリポジトリの構成を説明して」

ログイン先を間違えない

Pro/Max プランのつもりで API キーでログインすると、従量課金で請求が発生します。サイドパネルのアカウント表示で、どちらの認証で動いているかを最初に確認してください。

CLI もあわせて入れておく

拡張機能だけでも動作しますが、ターミナル版の claude コマンドも入れておくことを勧めます。理由は 3 つあります。

  • claude mcp add や claude config など、CLI からしか実行できない設定コマンドがある
  • claude -p の非対話モードは CI やスクリプトで使う(非対話モードの使い方)
  • 拡張機能の不調時に、同じ設定のまま CLI で作業を続けられる

インストールはネイティブインストーラーが推奨されています。

# macOS / Linux
curl -fsSL https://claude.ai/install.sh | bash

# Windows (PowerShell)
irm https://claude.ai/install.ps1 | iex

npm 経由(npm install -g @anthropic-ai/claude-code)でも入りますが、公式は自動更新が効くネイティブインストーラーを推奨しています。

用語解説

サイドパネルと統合ターミナルの違い: 拡張機能のサイドパネルは差分表示やファイル参照が GUI で見やすい一方、VS Code の統合ターミナルで claude を起動すれば CLI と同じキーボード操作が使えます。どちらも同じ設定を読むため、好みで切り替えて問題ありません。

導入直後に見直したい 5 項目

1. 権限モードを決める

Claude Code はファイル編集やコマンド実行のたびに許可を求めるのが既定です。毎回 Yes を押すのが煩わしい場合は、acceptEdits(編集は自動許可、コマンドは確認)から始めるのが現実的です。設定方法は settings.json で permissions を設計する を参照してください。

2. CLAUDE.md を作る

プロジェクトのルールをまとめた CLAUDE.md があると、指示のたびに前提を説明する手間が減ります。サイドパネルまたは CLI で /init を実行すると雛形が生成されます。書き方は CLAUDE.md の書き方 で詳しく扱っています。

3. モデルを確認する

/model で現在のモデルを確認できます。日常的な修正は Sonnet 系、設計や難しいデバッグは Opus 系、という使い分けが費用対効果の面で無難です。

4. 差分の確認方法を決める

拡張機能では、Claude が変更したファイルの差分がエディタ上に表示されます。自動承認にする場合でも、コミット前に git diff で全体を確認する運用にしておくと事故を防げます。

5. 秘密情報の読み取りを禁止する

.env や認証情報ファイルを Claude に読ませない設定を最初に入れておきます。具体的な deny 設定は AI コーディングツールに秘密情報を読ませないための設定 を参照してください。

よくあるつまずき

症状確認するポイント
サイドパネルにアイコンが出ないVS Code を再起動する。派生エディタでは拡張の互換性を確認する
ログイン後に「plan not supported」と出る無料プランのアカウントでログインしている。Pro 以上のプランか API キーが必要
プロキシ環境で接続できないHTTPS_PROXY 環境変数を VS Code 起動元のシェルに設定する
日本語入力が確定前に送信される統合ターミナル側で使う場合は IME の Enter 挙動を確認する。サイドパネルでは発生しにくい

まとめ

  • 拡張機能は「Claude Code」で検索し、発行元 Anthropic のものを入れる
  • 利用には Pro 以上のプランか API キーが必要で、無料プランでは使えない
  • CLI もあわせて入れておくと、設定コマンドや非対話モードが使える
  • 導入直後に、権限モード・CLAUDE.md・秘密情報の deny 設定を整える

よくある質問

Claude Code の VS Code 拡張は無料で使えますか?
拡張機能自体は無料ですが、利用には Claude Pro/Max などの有料プラン、または Anthropic Console の API キー(従量課金)が必要です。
VS Code 拡張とターミナル版の claude コマンドは別物ですか?
同じ Claude Code です。拡張はサイドパネルの GUI から、CLI はターミナルから同じエンジンを操作します。設定ファイル(settings.json や CLAUDE.md)も共通です。
Cursor や Windsurf でも使えますか?
VS Code 派生エディタでも拡張機能をインストールすれば動作します。マーケットプレイスで見つからない場合は VSIX を手動でインストールします。

参考にした一次情報

この記事は公式ドキュメントを基に AI が下書きを作成し、運営者が内容を確認して公開しています。誤りを見つけた場合はお問い合わせからお知らせください。

関連記事