Claude Code for VS Code 使用教程

Claude Code は Anthropic が提供する Agentic Coding ツールであり、世界最強のプログラミングエージェントの一つとも言われています。Claude Code の VS Code 拡張は、ネイティブなグラフィカルインターフェースを提供し、インライン Diff ビュー、@-mentions 参照、計画レビューなどの機能をサポートしており、VS Code で Claude Code を使用するための推奨方法です。この文書では、AceData Cloud のプロキシサービスを通じて、VS Code で Claude Code 拡張を設定し使用する方法を主に説明します。

申請プロセス

Claude Code を使用するには、まず Claude Messages サービスページにアクセスし、「Acquire」ボタンをクリックして、リクエストに必要な資格情報を取得します：

まだログインまたは登録していない場合は、自動的にログインページにリダイレクトされ、登録とログインを促されます。ログインまたは登録後、現在のページに自動的に戻ります。初回申請時には無料のクレジットが付与され、Claude Code サービスを無料で体験できます。

プラグインのインストール

システム要件

VS Code 1.98.0 以上（Cursor もサポート）

インストール手順

VS Code / Cursor の拡張マーケットプレイスで、Cmd+Shift+X（Mac）または Ctrl+Shift+X（Windows/Linux）を押して拡張ビューを開き、Claude Code を検索し、Anthropic が公式にリリースしたプラグインを見つけて「Install」をクリックしてインストールします： VS Code Marketplace 中の Claude Code プラグイン

VS Code Marketplace 中の Claude Code プラグイン

以下のリンクから直接インストールすることもできます：

インストール後、ポップアップの情報提示で信頼を選択すれば、インストールが完了します。

インストール後に拡張が表示されない場合は、VS Code を再起動するか、コマンドパネルで「Developer: Reload Window」を実行してください。

AceData Cloud API の設定

プラグインを初めて開くと、Anthropic の公式アカウントにログインするように促されます。公式ログインをスキップし、AceData Cloud のプロキシ API を設定することで使用できます。公式のサブスクリプションは不要です。

ステップ 1：環境変数の設定

以下のいずれかの場所で環境変数を設定できます： オプション A：ユーザーレベルの設定（すべてのプロジェクトに適用） ~/.claude/settings.json を編集（存在しない場合は作成）し、env 設定を追加し、{token} を AceData Cloud コンソールで取得した API トークンに置き換えます：

{
  "env": {
    "ANTHROPIC_AUTH_TOKEN": "{token}",
    "ANTHROPIC_BASE_URL": "https://api.acedata.cloud"
  }
}

オプション B：プロジェクトレベルの設定（現在のプロジェクトのみ） プロジェクトのルートディレクトリに .claude/settings.json（共有設定）または .claude/settings.local.json（個人設定、gitignored）を作成します：

{
  "env": {
    "ANTHROPIC_AUTH_TOKEN": "{token}",
    "ANTHROPIC_BASE_URL": "https://api.acedata.cloud"
  }
}

ヒント：API トークンは AceData Cloud コンソールで確認できます。ANTHROPIC_AUTH_TOKEN の値には自動的に Bearer プレフィックスが追加され、サーバーに送信されます。プロジェクトレベルの設定はユーザーレベルの設定よりも優先されます。チームプロジェクトでは .claude/settings.json で共有設定を使用し、個人の敏感情報は .claude/settings.local.json に保存することをお勧めします。

ステップ 2：ログイン提示を無効にする（オプション）

毎回開くたびにログイン提示を見たくない場合は、VS Code の設定で Disable Login Prompt にチェックを入れます：設定で「Claude Code login」を検索し、Disable Login Prompt オプションにチェックを入れれば完了です。設定が完了したら、Claude Code プラグインパネルを再度開くことで、正常に使用を開始できます。

Claude Code パネルを開く

インストールと設定が完了したら、Claude Code を開く方法はいくつかあります：

方法	操作
エディターツールバー	エディタの右上隅にある ✦ Spark アイコンをクリック（ファイルを開く必要があります）
ステータスバー	下部のステータスバー右側の「✱ Claude Code」をクリック（ファイルを開く必要はありません）
コマンドパネル	`Cmd+Shift+P` / `Ctrl+Shift+P` を押し、「Claude Code」を検索
ショートカットキー	`Cmd+Esc`（Mac）/ `Ctrl+Esc`（Windows/Linux）でフォーカスを切り替え

Cursor / Copilot などのツールがサイドバーを使用するのとは異なり、Claude Code はデフォルトでエディタービューをチャットエリアとして採用しており、可視領域が広く、内容の表示が豊富です。パネルをサイドバーや他の位置にドラッグすることもできます。 VS Code 中の Claude Code パネル

基本使用

対話インタラクション

Claude Code パネルに自然言語を直接入力することで、Claude とインタラクションできます。例えば：

「このプロジェクトの全体アーキテクチャを分析して」
「このコードにバグがあるので、修正して」
「この関数をリファクタリングして、可読性を向上させて」
「このモジュールにユニットテストを書いて」

Claude Code は自動的にあなたのコードベースのコンテキストを理解し、ファイルを跨いで分析と編集を行います。Claude がファイルを修正する必要がある場合、Diff 比較ビューが表示され、変更を受け入れるか拒否するかを選択できます。 VS Code 中の Claude Code 対話と提示

コンテキスト参照

対話中に @ 記号を使用することで、特定のファイルやコンテキストを参照できます：

@filename.py — 指定ファイルを参照（あいまいマッチをサポート）
@src/components/ — ディレクトリ全体を参照（末尾にスラッシュが必要）
@terminal:name — ターミナル出力を参照

エディタ内のコードを選択した後、Option+K（Mac）/ Alt+K（Windows/Linux）を押すことで、@ 参照（例：@app.ts#5-10）を迅速に挿入できます。

スラッシュコマンド

対話ボックス内の / アイコンをクリックするか、直接 / を入力することで、豊富な組み込み機能を使用できます：よく使うコマンドには以下が含まれます：

コマンド	機能
`/new`	新しい対話を作成
`/model`	モデルを切り替える
`/compact`	コンテキストを圧縮する
`/mcp`	MCP サービスを設定する
`/config`	設定を開く
`/usage`	使用量を確認する
`/memory`	Claude の記憶を管理する
`/help`	ヘルプ情報を表示する

過去の対話を確認

パネルの上部にあるドロップダウンメニューをクリックすることで、過去の対話履歴を確認できます。キーワード検索や時間帯（Today、Yesterday、Last 7 days など）でブラウズでき、以前のインタラクション内容を簡単に振り返ることができます。任意の対話をクリックすると、完全なメッセージ履歴を復元できます。

コード変更のレビュー

Claude がファイルを修正する必要がある場合、Diff 比較ビューが表示され、元のコードと修正後の比較が示されます。各変更を受け入れるか拒否するかを選択でき、Claude に異なるアプローチを伝えることもできます： VS Code 中的 Diff 对比视图

権限モード

パネルの下部にあるモードインジケーターを使用して、異なる権限モードを切り替えることができます：

モード	説明
Default（Ask）	操作の前に毎回確認を求める（デフォルト）
Plan	Claudeが計画を立て、承認を待ってから実行する
acceptEdits	ファイル編集を自動的に受け入れるが、ターミナルコマンドは確認が必要
bypassPermissions	すべての権限提示をスキップし、完全自動化（慎重に使用）

複数セッションの並行

コマンドパネルの Open in New Tab または Open in New Window を使用して、複数の独立した対話を開始できます。各対話は独自の履歴とコンテキストを維持し、異なるタスクを並行して処理できます。

その他の設定

モデルの切り替え

Claude Codeは、Claude Sonnet、Claude Opusなど、異なるモデルの切り替えをサポートしています。 /model コマンドまたはプラグイン設定の Selected Model で設定できます。

自動モード

プラグイン設定で Initial Permission Mode を bypassPermissions に設定すると、Claude Codeがファイル編集やターミナルコマンドなどの操作を行う際に、逐一ポップアップ確認が表示されず、完全自動化されたワークフローを実現します。また、acceptEdits に設定することで、編集を自動的に受け入れつつ、ターミナルコマンドは確認が必要な半自動モードを実現できます。

注意：自動モードを有効にする前に、そのリスクを理解していることを確認してください。信頼できるプロジェクト環境での使用をお勧めします。

ターミナルでCLIを使用

コマンドラインスタイルを好む場合は、VS Codeの設定で Use Terminal にチェックを入れると、Claude CodeがCLIモードで統合ターミナル内で実行されます。また、VS Codeの統合ターミナルを直接開き、claude コマンドを実行することもできます。

よくある質問

接続に失敗した場合は？

~/.claude/settings.json または .claude/settings.json の環境変数設定が正しいことを確認してください。特に ANTHROPIC_AUTH_TOKEN と ANTHROPIC_BASE_URL
APIトークンが有効であることを確認してください（コンソールで確認可能）
ネットワーク接続が正常であることを確認し、https://api.acedata.cloud にアクセスできることを確認してください
VS Codeを再起動して再試行してください

Sparkアイコンが表示されない？

ファイルが開いていることを確認してください（フォルダーを開くだけでは不十分です）
VS Codeのバージョンが1.98.0以上であることを確認してください
コマンドパネルで「Developer: Reload Window」を実行してください
または、下部のステータスバーの「✱ Claude Code」を直接クリックしてください

残りのクレジットを確認するには？

AceData Cloudコンソールにログインすると、現在のアカウントの残りのクレジットと使用状況を確認できます。

さらに詳しく

📖 Claude Code VS Code公式ドキュメント
⌨️ VS Codeコマンドとショートカットのリファレンス
🔧 AceData Cloud Claude Codeサービス
💬 何か質問がある場合は、プラットフォームのカスタマーサポートにお問い合わせください

​申請プロセス

​プラグインのインストール

​システム要件

​インストール手順

​AceData Cloud API の設定

​ステップ 1：環境変数の設定

​ステップ 2：ログイン提示を無効にする（オプション）

​Claude Code パネルを開く

​基本使用

​対話インタラクション

​コンテキスト参照

​スラッシュコマンド

​過去の対話を確認

​コード変更のレビュー

​権限モード

​複数セッションの並行

​その他の設定

​モデルの切り替え

​自動モード

​ターミナルでCLIを使用

​よくある質問

​接続に失敗した場合は？

​Sparkアイコンが表示されない？

​残りのクレジットを確認するには？

​さらに詳しく