🤖 Claude Code を VS Code で使う方法
〜 初心者がやってみたWindows環境でのセットアップガイド 〜
📌 はじめに
Anthropicが開発したAIコーディングアシスタント「Claude Code」を、Visual Studio Code（VS Code）上で使えるようにセットアップする方法を紹介します。
本記事では以下のような方を対象に、最初から順番に進められるよう手順をまとめています。
- ✅ Anthropicアカウントをまだお持ちでない方
- ✅ Node.jsが未インストールの方
- ✅ Windows環境で使いたい方
💡 Claude Code とは？
Claude CodeはAnthropicが提供するAIエージェントです。単なるコード補完ツールではなく、ターミナル上で動作し、ファイルの読み書き・編集・コマンド実行まで自律的に行える「エージェント型」のAIアシスタントです。
VS Code拡張機能を使うことで以下のことが可能になります。
| 機能 | 説明 |
|---|---|
| 💬 サイドパネルチャット | ターミナルを切り替えずにVS Code内から指示を出せる |
| 📝 差分表示（diff） | コード変更をGUIで確認・承認できる |
| 📎 @ファイル指定 | 特定のファイルや行をコンテキストとして指定できる |
| 🔀 複数会話 | 別タブで複数の会話を同時に開ける |
⚙️ 事前に確認すること
必要な環境
| 項目 | 要件 |
|---|---|
| OS | Windows |
| Node.js | v18以上（インストール方法は後述） |
| VS Code | v1.85以上 |
| Anthropicアカウント | （作成方法は後述） |
Windowsユーザーへの注意
PowerShellのスクリプト実行ポリシーがデフォルトで制限されており、そのままではnpmコマンドが使えないことがあります。本記事の手順内で解決方法を説明します。
🗺️ セットアップの全体の流れ
以下の 6ステップ で進めます。
① Anthropicアカウント作成
↓
② Node.jsのインストール
↓
③ PowerShell実行ポリシーの変更（Windows特有）
↓
④ Claude Code CLIのインストール
↓
⑤ VS Code拡張機能のインストール
↓
⑥ 初回起動・ログイン認証
STEP① 🔑 Anthropicアカウントの作成
まず、Claude Codeを使用するためのAnthropicアカウントを作成します。
1. ブラウザで以下のURLを開く
https://console.anthropic.com/login
2. サインアップ方法を選択する
- 🟦 「Continue with Google」（Googleアカウント連携・おすすめ）
- 📧 メールアドレスで登録
3. 画面の指示に従って登録を完了する
Googleアカウントをお持ちの場合は「Continue with Google」が最も簡単で素早く登録できます。
STEP② 📦 Node.jsのインストール
まずインストール済みか確認する
PowerShellを開いて以下のコマンドを実行してください。
node --version
結果の見方：
| 表示内容 | 対応 |
|---|---|
v18.x.x 以上が表示された |
✅ インストール済み → STEP③へ |
| エラーが表示された | ❌ 未インストール → 以下の手順でインストール |
インストールされていない場合
1. ブラウザで以下のURLを開く
https://nodejs.org/en/download
2. 「Windows Installer (.msi)」ボタンをクリックしてダウンロード
3. ダウンロードしたファイルをダブルクリックして実行
4. インストールウィザードに従って「Next」を押し続けて完了
インストール後の確認
PowerShellを一度閉じて、新しく開き直してから確認してください。
既存のウィンドウは古い環境変数を参照しているため、インストールが認識されません。
node --version
# 例: v24.14.0 と表示されればOK
STEP③ 🔧 PowerShell実行ポリシーの変更
Windowsでは、デフォルトでPowerShellのスクリプト実行が制限されており、そのままでは npm コマンドが以下のようなエラーになります。
npm : このシステムではスクリプトの実行が無効になっているため...
以下の手順で解除します。
1. PowerShellを「管理者として実行」で開く
Windowsキー →
powershellと入力 → 右クリック → 「管理者として実行」
2. 以下のコマンドを実行する
Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUser
3. Y を入力してEnterで確定
4. 以下のコマンドで確認
npm --version
# 例: 11.9.0 と表示されればOK
-Scope CurrentUser を指定することで、現在のユーザーのみに変更が適用されます。システム全体の設定には影響しません。
STEP④ 💻 Claude Code CLIのインストール
PowerShell（管理者）で以下のコマンドを実行します。
npm install -g @anthropic-ai/claude-code
以下のような表示が出ればインストール成功です🎉
added 2 packages in 5s
npmの新しいバージョンが利用可能という通知（npm notice New minor version of npm available!）が出ることがありますが、無視してもClaude Codeの動作には影響ありません。
STEP⑤ 🧩 VS Code拡張機能のインストール
VS Codeを開き、以下の手順で拡張機能をインストールします。
1. Ctrl+Shift+X を押して拡張機能パネルを開く
2. 検索欄に Claude Code と入力
3. 以下の拡張機能を選択して「インストール」をクリック
| 項目 | 確認内容 |
|---|---|
| 拡張機能名 | Claude Code for VS Code |
| 発行元 | Anthropic ✅ |
| 識別子 | anthropic.claude-code |
マーケットプレイスには同名の非公式拡張機能も存在します。
必ず発行元が「Anthropic」であることを確認してからインストールしてください。
STEP⑥ 🚀 初回起動・ログイン認証
VS Codeのターミナルを開いてClaude Codeを起動します。
1. VS Codeで Ctrl+` を押して統合ターミナルを開く
2. 以下のコマンドを実行
claude
3. ブラウザが自動的に開くので、AnthropicアカウントでOAuth認証を行う
4. 認証完了後、ターミナルに以下のような画面が表示される
╭─────────────────────────────────────╮
│ Claude Code v2.x.x │
│ Welcome back ○○！ │
│ Sonnet 4.6 · Claude Pro │
╰─────────────────────────────────────╯
右側のサイドパネルにClaude Codeのチャット画面が表示されれば、セットアップ完了です！🎉
✅ 動作確認
セットアップ完了後は以下のような操作が可能です。
基本的な使い方
# ファイルを開いた状態でClaude Codeに話しかける
> このコードのバグを見つけて修正して
# プロジェクト用の設定ファイルを自動生成
> /init
# 特定のファイルをコンテキストとして指定
> @src/index.ts このファイルを最適化して
便利なキーボードショートカット
| ショートカット | 動作 |
|---|---|
Ctrl+Shift+P → Claude Code
|
コマンドパレットからClaude Codeを操作 |
Alt+K |
選択中のコードを@メンションとして挿入 |
📋 まとめ
本記事では、WindowsにClaude CodeをVS Codeで使えるようにセットアップする手順を紹介しました。
セットアップ完了チェックリスト
- Anthropicアカウント作成完了
- Node.js v18以上インストール済み
- PowerShell実行ポリシー変更済み
-
Claude Code CLI（
npm install -g）インストール済み - VS Code拡張機能（発行元：Anthropic）インストール済み
-
claudeコマンドで起動・ログイン認証完了
ハマりやすいポイントまとめ
| ポイント | 対処法 |
|---|---|
node コマンドが認識されない |
PowerShellを閉じて新しく開き直す |
npm がセキュリティエラーになる |
Set-ExecutionPolicy で実行ポリシーを変更する |
| 拡張機能が見つからない/偽物 | 発行元が「Anthropic」であることを確認 |
ぜひClaude Codeを活用して、日々の開発作業をより効率的に進めてみてください！🚀