VS Code で MCP サーバーを使用する

Model Context Protocol (MCP) サーバーを使用すると、データベースへの接続、API の呼び出し、特殊なタスクの実行などの追加ツールを使用して、VS Code でのチャットエクスペリエンスを拡張できます。Model Context Protocol (MCP) は、AI モデルが統一されたインターフェースを通じて外部ツールやサービスと対話できるようにするオープンスタンダードです。この記事では、VS Code で MCP サーバーを設定し、エージェントモードでツールを使用する方法について説明します。

前提条件

• Visual Studio Code の最新バージョンをインストールします
• Copilot へのアクセス

MCP とは？

Model Context Protocol (MCP) は、AI モデルが外部ツール、アプリケーション、データソースを検出して対話するための標準化された方法を提供します。VS Code でエージェントモードの言語モデルにチャットプロンプトを入力すると、モデルはファイル操作、データベースへのアクセス、API の呼び出しなどのタスクを実行するためにさまざまなツールを呼び出すことができます。

VS Code で MCP サポートを有効にする

MCP サポートを一元的に管理する

組織で MCP サポートを一元的に管理するには、2 つのオプションがあります

• デバイス管理: グループポリシーまたは構成プロファイルを使用して、組織の MCP サポートを一元的に有効または無効にします。デバイス管理による VS Code 設定の管理の詳細については、こちらをご覧ください。

• GitHub Copilot ポリシー: GitHub Copilot ポリシーを使用して、組織内の MCP サーバーの可用性を制御します。GitHub Copilot ドキュメントの「エンタープライズにおける Copilot のポリシーと機能の管理」の詳細については、こちらをご覧ください。

MCP サーバーを追加する

VS Code で MCP サーバーを追加するには複数のオプションがあります

• 直接インストール: MCP サーバーの厳選されたリストにアクセスし、任意の MCP サーバーで インストール を選択すると、VS Code インスタンスに自動的に追加されます。
• ワークスペース設定: ワークスペースに .vscode/mcp.json ファイルを追加して、ワークスペースの MCP サーバーを構成し、チームメンバーと構成を共有します。
• ユーザー設定: ユーザー設定 (MCP: ユーザー構成を開く) でサーバーを指定すると、設定の同期を介して同期され、すべてのワークスペースで MCP サーバーが有効になります。
• 自動検出: Claude Desktop などの他のツールで定義されている MCP サーバーの自動検出 (chat.mcp.discovery.enabled) を有効にします。

構成されている MCP サーバーのリストを表示および管理するには、コマンドパレットから MCP: インストールされているサーバーを表示 コマンドを実行するか、拡張機能ビューの MCP サーバー - インストール済み セクションにアクセスします。

MCP サーバーを追加した後、エージェントモードでそれが提供するツールを使用できます。

ワークスペースに MCP サーバーを追加する

特定のワークスペースの MCP サーバーを構成するには、ワークスペースフォルダーに .vscode/mcp.json ファイルを作成します。これにより、サーバー構成をプロジェクトチームのメンバーと共有できます。

ワークスペースに MCP サーバーを追加するには

1. ワークスペースに .vscode/mcp.json ファイルを作成します。

2. サーバーを追加 ボタンを選択して、新しいサーバーのテンプレートを追加します。VS Code は MCP サーバー構成ファイルの IntelliSense を提供します。

   次の例は、Perplexity MCP サーバーを構成する方法を示しています。サーバーが起動すると、VS Code は API キーを要求します。構成形式について詳しくはこちらをご覧ください。

   {
     // 💡 Inputs are prompted on first server start, then stored securely by VS Code.
     "inputs": [
       {
         "type": "promptString",
         "id": "perplexity-key",
         "description": "Perplexity API Key",
         "password": true
       }
     ],
     "servers": {
       // https://github.com/github/github-mcp-server/
       "Github": {
         "url": "https://api.githubcopilot.com/mcp/"
       },
       // https://github.com/ppl-ai/modelcontextprotocol/
       "Perplexity": {
         "type": "stdio",
         "command": "npx",
         "args": ["-y", "server-perplexity-ask"],
         "env": {
           "PERPLEXITY_API_KEY": "${input:perplexity-key}"
         }
       }
     }
   }
   

3. または、コマンドパレットから MCP: サーバーを追加 コマンドを実行し、追加する MCP サーバーのタイプを選択してサーバー情報を提供します。次に、ワークスペース設定 を選択して、ワークスペースに .vscode/mcp.json ファイルを (まだ存在しない場合は) 作成します。

ユーザー構成に MCP サーバーを追加する

すべてのワークスペースの MCP サーバーを構成するには、サーバー構成をユーザー構成に追加できます。これにより、同じサーバー構成を複数のプロジェクトで再利用できます。

MCP をユーザー構成に追加するには、MCP: ユーザー構成を開く コマンドを実行します。これにより、ユーザープロファイルの mcp.json ファイルが開きます。ファイルが存在しない場合、VS Code はファイルを作成します。

または、コマンドパレットから MCP: サーバーを追加 コマンドを使用し、サーバー情報を提供した後、グローバル を選択してサーバー構成をプロファイルに追加します。

複数の VS Code プロファイルを使用している場合、これによりアクティブなプロファイルに基づいて異なる MCP サーバー構成を切り替えることができます。たとえば、Playwright MCP サーバーは Web 開発プロファイルで構成できますが、Python 開発プロファイルでは構成できません。

Dev Container のサポート

MCP サーバーは、devcontainer.json ファイルを介して Dev Container で構成できます。これにより、コンテナ化された開発環境の一部として MCP サーバー構成を含めることができます。

Dev Container で MCP サーバーを構成するには、サーバー構成を customizations.vscode.mcp セクションに追加します

{
  "image": "mcr.microsoft.com/devcontainers/typescript-node:latest",
  "customizations": {
    "vscode": {
      "mcp": {
        "servers": {
          "playwright": {
            "command": "npx",
            "args": ["-y", "@microsoft/mcp-server-playwright"]
          }
        }
      }
    }
  }
}

Dev Container が作成されると、VS Code は MCP サーバー構成をリモートの mcp.json ファイルに自動的に書き込み、コンテナ化された開発環境でそれらを利用できるようにします。

MCP サーバーの自動検出

VS Code は、Claude Desktop など、他のツールで定義した MCP サーバーを自動的に検出し、再利用できます。

chat.mcp.discovery.enabled 設定で自動検出を有効にします。

構成形式

MCP サーバーを定義するには、次の JSON 構成形式を使用します。

• "servers": {}

  MCP サーバーのリストが含まれており、Claude Desktop の構成形式に従います。

  サーバー名をキーとして指定し、サーバー構成を値として提供します。VS Code は MCP サーバーリストにサーバー名を表示します。サーバー名の命名規則に従ってください

  • サーバー名には "uiTesting" のように camelCase を使用します。
  • 空白や特殊文字は使用しないでください。
  • 競合を避けるため、各サーバーに一意の名前を使用します。
  • "github" や "database" のように、サーバーの機能やブランドを反映した説明的な名前を使用します。

  サーバー構成で次のフィールドを指定します。サーバー構成では、ワークスペースフォルダー (${workspaceFolder}) などを参照するために定義済み変数を使用できます。

  `stdio` のサーバー構成

  フィールド	説明	例
  タイプ	サーバー接続タイプ。	"stdio"
  コマンド	サーバー実行可能ファイルを開始するコマンド。このコマンドはシステムパス上で利用可能であるか、その完全なパスが含まれている必要があります。 Docker を使用する場合、デタッチオプションを使用しないでください。	"npx","node", "python", "docker"
  引数	コマンドに渡される引数の配列。	["server.py", "--port", "3000"]
  環境	サーバーの環境変数。	{"API_KEY": "${input:api-key}"}
  envFile	追加の環境変数を読み込む .env ファイルへのパス。	"${workspaceFolder}/.env"

  `sse` または `http` のサーバー構成

  フィールド	説明	例
  タイプ	サーバー接続タイプ。VS Code は最初にストリーミング可能な HTTP 転送を試行し、HTTP がサポートされていない場合は SSE にフォールバックします。	"sse", "http"
  URL	サーバーの URL。	"https://:3000"
  ヘッダー	サーバーの HTTP ヘッダー。	{"API_KEY": "${input:api-key}"}

• "inputs": []

  API キーやパスワードなどの機密情報をサーバー構成にハードコーディングすることを避けるために、構成値のカスタムプレースホルダーを定義できます。

  VS Code は、サーバーが初めて起動するときにこれらの値を要求し、その後の使用のために安全に保存します。入力された値を表示しないようにするには、password フィールドを true に設定します。

  VS Code で入力変数を構成する方法について詳しくはこちらをご覧ください。

構成例

次のコードスニペットは、3 つのサーバーを指定し、API キーの入力プレースホルダーを定義する MCP サーバー構成の例を示しています。

// Example .vscode/mcp.json
{
  // 💡 Inputs will be prompted on first server start,
  //    then stored securely by VS Code.
  "inputs": [
    {
      "type": "promptString",
      "id": "perplexity-key",
      "description": "Perplexity API Key",
      "password": true
    }
  ],
  "servers": {
    // https://github.com/ppl-ai/modelcontextprotocol/
    "Perplexity": {
      "type": "stdio",
      "command": "docker",
      "args": ["run", "-i", "--rm", "-e", "PERPLEXITY_API_KEY", "mcp/perplexity-ask"],
      "env": {
        "PERPLEXITY_API_KEY": "${input:perplexity-key}"
      }
    },
    // https://github.com/github/github-mcp-server/
    "Github": {
      "url": "https://api.githubcopilot.com/mcp/"
    },
    // https://github.com/modelcontextprotocol/servers/tree/main/src/fetch
    "fetch": {
      "type": "stdio",
      "command": "uvx",
      "args": ["mcp-server-fetch"]
    }
  }
}

エージェントモードで MCP ツールを使用する

MCP サーバーを追加したら、エージェントモードでそれが提供するツールを使用できます。

エージェントモードで MCP ツールを使用するには

1. チャット ビュー (⌃⌘I (Windows、Linux Ctrl+Alt+I)) を開き、ドロップダウンから エージェント モードを選択します。

   

2. ツール ボタンを選択して、利用可能なツールのリストを表示します。

   必要に応じて、使用するツールを選択または選択解除します。検索ボックスにツール名を入力して検索できます。

   

   重要

   1 つのチャットリクエストで一度に最大 128 個のツールを有効にできます。128 個を超えるツールが選択されている場合は、ツールピッカーでいくつかのツールを選択解除してツールの数を減らしてください。

3. チャット入力ボックスにプロンプトを入力すると、必要に応じてツールが自動的に呼び出されるのがわかります。

   既定では、ツールが呼び出されると、実行する前にアクションを確認する必要があります。これは、ツールがローカルマシンで実行され、ファイルやデータを変更するアクションを実行する可能性があるためです。

   続行 ボタンのドロップダウンオプションを使用して、現在のセッション、ワークスペース、または今後のすべての呼び出しに対して特定のツールを自動的に確認します。

   

   ヒント

   プロンプトでツール名を # に続けて入力することで、ツールを直接参照することもできます。これは、すべてのチャットモード (質問、編集、エージェントモード) で実行できます。

4. 必要に応じて、ツールを実行する前に入力パラメーターを確認および編集します。

   

MCP の情報の引き出し

MCP サーバーは、情報の引き出し (elicitation) を通じて追加の入力を要求できます。MCP サーバーがタスクを完了するためにより多くの情報を必要とする場合、確認、構成値、または操作に必要なその他のパラメーターなどの特定の詳細をプロンプトで求めることができます。

MCP サーバーが情報の引き出し要求を送信すると、VS Code は要求された情報を提供できるダイアログまたは入力フィールドを表示します。これにより、MCP サーバーは、すべての構成を事前に設定することなく、必要なデータを動的に収集できます。

MCP リソースを使用する

ツールに加えて、MCP サーバーはチャットプロンプトでコンテキストとして使用できるリソースも提供できます。たとえば、ファイルシステム MCP サーバーはファイルやディレクトリへのアクセスを提供でき、データベース MCP サーバーはデータベーステーブルへのアクセスを提供できます。

MCP サーバーからチャットプロンプトにリソースを追加するには

1. チャットビューで、コンテキストを追加 > MCP リソース を選択します。

2. リストからリソースタイプを選択し、オプションのリソース入力パラメーターを指定します。

   

MCP サーバーで利用可能なリソースのリストを表示するには、MCP: リソースをブラウズ コマンドを使用するか、MCP: サーバーをリスト > リソースをブラウズ コマンドを使用して特定のサーバーのリソースを表示します。

MCP ツールは、応答の一部としてリソースを返すことができます。これらのリソースは、保存 ボタンを使用するか、リソースをエクスプローラービューにドラッグアンドドロップすることで、ワークスペースに表示または保存できます。

MCP プロンプトを使用する

MCP サーバーは一般的なタスクのために事前設定されたプロンプトを提供できるため、凝ったチャットプロンプトを入力する必要はありません。これらのプロンプトは、チャット入力ボックスで / に続けてプロンプト名 (mcp.servername.promptname の形式) を入力することで直接呼び出すことができます。必要に応じて、プロンプトが追加の入力パラメーターを要求する場合があります。

関連するツールをツールセットにグループ化する

MCP サーバーを追加するにつれて、ツールのリストが長くなる可能性があります。これにより、たとえば再利用可能なプロンプトファイルやカスタムチャットモードを定義したい場合に、個々のツールの管理が面倒になる可能性があります。

ツールを管理しやすくするために、関連するツールをツールセットにグループ化できます。ツールセットは、単一のエンティティとして参照できる個々のツールのコレクションです。ツールセットには、組み込みツール、MCP ツール、または拡張機能によって提供されるツールを含めることができます。

VS Code でツールセットを作成して使用する方法について詳しくはこちらをご覧ください。

MCP サーバーを管理する

インストールされている MCP サーバーのリストは、VS Code の拡張機能ビュー (⇧⌘X (Windows、Linux Ctrl+Shift+X)) の MCP サーバー - インストール済み セクションから管理できます。この専用ビューにより、インストール済みの MCP サーバーの監視、構成、制御が容易になります。

MCP サーバーを右クリックするか、歯車アイコンを選択して、次のアクションを実行します

• 開始/停止/再起動: MCP サーバーを開始、停止、または再起動します。
• アカウントを切断: MCP サーバーでの認証用のアカウントを切断します。
• 出力を表示: サーバーログを表示して問題を診断します。
• 構成を表示: MCP サーバーの構成を表示します。
• モデルアクセスを構成: MCP サーバーがアクセスできるモデル (サンプリング) を構成します。
• サンプリングリクエストを表示: MCP サーバーによって行われたサンプリングリクエストを表示します。
• リソースをブラウズ: MCP サーバーによって提供されるリソースを表示します。
• アンインストール: 環境から MCP サーバーをアンインストールします。

または、コマンドパレットから MCP: サーバーをリスト コマンドを実行して、構成されている MCP サーバーのリストを表示します。その後、サーバーを選択してアクションを実行できます。

コマンドライン構成

VS Code コマンドラインインターフェースを使用して、MCP サーバーをユーザープロファイルまたはワークスペースに追加することもできます。

MCP サーバーをユーザープロファイルに追加するには、--add-mcp コマンドラインオプションを使用し、{\"name\":\"server-name\",\"command\":...} の形式で JSON サーバー構成を提供します。

code --add-mcp "{\"name\":\"my-server\",\"command\": \"uvx\",\"args\": [\"mcp-server-fetch\"]}"

URL ハンドラー

VS Code には、MCP サーバーをインストールするために使用できる URL ハンドラーも含まれています。URL を作成するには、--add-mcp に提供するのと同じ形式で obj オブジェクトを構築し、次のロジックを使用してリンクを作成します

// For Insiders, use `vscode-insiders` instead of `code`
const link = `vscode:mcp/install?${encodeURIComponent(JSON.stringify(obj))}`;

このリンクは、ブラウザーで使用することも、コマンドライン (例: Linux で xdg-open $LINK) で開くこともできます。

デバイス間で MCP サーバーを同期する

設定の同期を有効にすると、MCP サーバー構成を含む設定と構成をデバイス間で同期できます。これにより、すべてのデバイスで一貫した開発環境を維持し、同じ MCP サーバーにアクセスできます。

設定の同期で MCP サーバーの同期を有効にするには、コマンドパレットから 設定の同期: 構成 コマンドを実行し、同期された構成のリストに MCP サーバー が含まれていることを確認します。

MCP サーバーのトラブルシューティングとデバッグ

MCP 出力ログ

VS Code が MCP サーバーで問題に遭遇すると、チャットビューにエラーインジケーターが表示されます。

チャットビューのエラー通知を選択し、出力を表示 オプションを選択してサーバーログを表示します。または、コマンドパレットから MCP: サーバーをリスト を実行し、サーバーを選択して 出力を表示 を選択します。

MCP サーバーをデバッグする

MCP サーバー構成に dev キーを追加することで、MCP サーバーの開発モードを有効にできます。これは 2 つのプロパティを持つオブジェクトです

• watch: MCP サーバーを再起動するファイルの変更を監視するファイル glob パターン。
• debug: MCP サーバーでデバッガーを設定できます。

{
  "servers": {
    "gistpad": {
      "command": "node",
      "args": ["build/index.js"],
     "dev": {
       "watch": "build/**/*.js",
       "debug": { "type": "node" }
     },

よくある質問

どの MCP ツールが使用されるかを制御できますか？

はい、どのツールをアクティブにするかを制御するためのいくつかのオプションがあります

• エージェントモードでチャットビューの ツール ボタンを選択し、必要に応じて特定のツールをオン/オフに切り替えます。
• コンテキストを追加 ボタンを使用するか、# と入力して、プロンプトに特定のツールを追加します。
• より高度な制御については、.github/copilot-instructions.md を使用してツールの使用状況を微調整できます。

Docker を使用すると MCP サーバーが起動しない

コマンド引数が正しいこと、およびコンテナーがデタッチモード (-d オプション) で実行されていないことを確認します。エラーメッセージについては、MCP サーバーの出力も確認できます (トラブルシューティングを参照)。

「Cannot have more than 128 tools per request.」というエラーが表示されます。

モデルの制約により、1 つのチャットリクエストで一度に最大 128 個のツールを有効にできます。128 個を超えるツールが選択されている場合は、チャットビューのツールピッカーでいくつかのツールまたはサーバー全体を選択解除してツールの数を減らしてください。

関連リソース

• VS Code が厳選した MCP サーバーのリスト
• Model Context Protocol ドキュメント
• Model Context Protocol サーバーリポジトリ
• Visual Studio Code でエージェントモードを使用する