VS Codeのエージェントモードを拡張するには、を試してください!

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

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

前提条件

MCP とは?

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

MCP はどのように機能しますか?

MCP はクライアントサーバーアーキテクチャに従います

  • MCP クライアント (VS Code など) は MCP サーバーに接続し、AI モデルに代わってアクションを要求します
  • MCP サーバー は、明確に定義されたインターフェースを通じて特定の機能を提供する 1 つ以上のツールを提供します
  • Model Context Protocol (MCP) は、ツールの発見、呼び出し、応答処理など、クライアントとサーバー間の通信のためのメッセージ形式を定義します

たとえば、ファイルシステムの MCP サーバーは、ファイルやディレクトリの読み取り、書き込み、検索のためのツールを提供する場合があります。GitHub の MCP サーバーは、リポジトリの一覧表示、プルリクエストの作成、issue の管理のためのツールを提供します。MCP サーバーは、お使いのマシン上でローカルに実行することも、リモートでホストすることもでき、VS Code は両方の構成をサポートしています。

この対話を標準化することにより、MCP は各 AI モデルと各ツールの間でカスタム統合を行う必要性をなくします。これにより、ワークスペースに新しい MCP サーバーを追加するだけで、AI アシスタントの機能を拡張できます。Model Context Protocol の仕様について詳しくはこちらをご覧ください。

VS Code でサポートされている MCP 機能

VS Code は以下の MCP 機能をサポートしています

  • MCP サーバートランスポート: ローカル標準入出力 (stdio)、ストリーミング可能な HTTP (http)、およびサーバー送信イベント (sse、レガシーサポート)。
  • MCP の機能: ツール、プロンプト、リソース、導出、サンプリング、および認証。
  • VS Code は、roots (仕様) を使用して、現在のワークスペースフォルダーをサーバーに提供します。
MCP サーバーを見つける

VS Code ウェブサイトの厳選された MCP サーバーのリストは、素晴らしい出発点です。さまざまなカテゴリから選択し、MCP サーバーを VS Code に直接インストールできます。

MCP の公式サーバーリポジトリでは、MCP の多用途性を示す公式およびコミュニティ提供のサーバーが提供されています。ファイルシステム操作、データベースとのやり取り、Web サービスなど、さまざまな機能のサーバーを探索できます。

MCP はまだ比較的新しい標準であり、エコシステムは急速に進化しています。より多くの開発者が MCP を採用するにつれて、プロジェクトと統合できるサーバーやツールの数が増えることが期待されます。

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

VS Code の MCP サポートは、VS Code 1.102 から一般的に利用可能ですが、所属する組織によって無効にされている場合があります。

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

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

MCP サーバーを追加する

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

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

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

VS Code が初めて MCP サーバーを起動すると、サーバーの機能とツールが検出されます。その後、これらのツールをエージェントモードで使用できます。VS Code は MCP サーバーのツールリストをキャッシュします。キャッシュされたツールをクリアするには、コマンドパレットで MCP: キャッシュされたツールをリセット コマンドを使用します。

注意

MCP サーバーはマシン上で任意のコードを実行できます。信頼できるソースからのサーバーのみを追加し、起動する前に発行元とサーバー構成を確認してください。初めて MCP サーバーを起動するとき、VS Code はMCP サーバーを信頼するかどうかを確認するプロンプトを表示します。

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

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

重要

入力変数または環境ファイルを使用して、API キーやその他の資格情報などの機密情報をハードコーディングしないようにしてください。

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

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

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

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

    {
      // 💡 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 Containers で構成できます。これにより、コンテナ化された開発環境の一部として 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")。
    • 空白や特殊文字は使用しないでください。
    • 競合を避けるために、各サーバーに一意の名前を使用してください。
    • "github" や "database" など、サーバーの機能やブランドを反映した説明的な名前を使用してください。

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

    `stdio` のサーバー構成
    フィールド 説明
    type サーバー接続タイプ。 "stdio"
    コマンド サーバーの実行可能ファイルを起動するコマンド。コマンドはシステムパス上で利用可能であるか、完全なパスを含む必要があります。
    docker を使用する場合は、デタッチオプションを使用しないでください。
    "npx","node", "python", "docker"
    args コマンドに渡される引数の配列。 ["server.py", "--port", "3000"]
    環境 サーバーの環境変数。 {"API_KEY": "${input:api-key}"}
    envFile 追加の環境変数を読み込む .env へのパス。 "${workspaceFolder}/.env"
    `sse` または `http` のサーバー構成
    フィールド 説明
    type サーバー接続タイプ。VS Code はまずストリーミング可能な HTTP トランスポートを試み、HTTP がサポートされていない場合は SSE にフォールバックします。 "http", "sse"
    url サーバーの URL。 "https://:3000"
    headers サーバーの HTTP ヘッダー。 {"API_KEY": "${input:api-key}"}
  • "inputs": []

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

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

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

構成例

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

`.vscode/mcp.json` を表示
// 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))、ドロップダウンからエージェントモードを選択します。

    Agent mode dropdown option

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

    オプションで、使用したいツールを選択または選択解除します。検索ボックスに入力してツールを検索できます。

    MCP tools list

    重要

    チャットリクエストでは、一度に最大 128 個のツールを有効にできます。128 個を超えるツールが選択されている場合は、ツールピッカーで一部のツールを選択解除してツールの数を減らすか、仮想ツールが有効になっていることを確認してください (github.copilot.chat.virtualTools.threshold)。

  3. これで、チャット入力ボックスにプロンプトを入力し、必要に応じてツールが自動的に呼び出されるのを確認できます。

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

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

    MCP Tool Confirmation

    ヒント

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

  4. オプションで、ツールを実行する前にツール入力パラメーターを確認および編集します。

    MCP Tool Input Parameters

MCP 導出を使用する

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

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

MCP リソースを使用する

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

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

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

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

    Screenshot of the MCP resource Quick Pick, showing resource types provided by the GitHub MCP server.

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

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

MCP プロンプトを使用する

MCP サーバーは、一般的なタスク用に事前構成されたプロンプトを提供できるため、手の込んだチャットプロンプトを入力する必要はありません。チャット入力ボックスに / に続けて mcp.サーバー名.プロンプト名 の形式でプロンプト名を入力することで、これらのプロンプトを直接呼び出すことができます。オプションで、プロンプトは追加の入力パラメーターを要求する場合があります。

Screenshot of the Chat view, showing an MCP prompt invocation and a dialog asking for additional input parameters.

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

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

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

MCP サーバーを管理する

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

Screenshot showing the MCP servers in the Extensions view.

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

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

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

ヒント

MCP: ワークスペースフォルダーの MCP 構成を開くを介して .vscode/mcp.json ファイルを開くと、VS Code はエディターから直接サーバーを開始、停止、または再起動するコマンドを表示します。

MCP server configuration with lenses to manage server.

MCP サーバーを自動的に起動する

MCP サーバーを追加したり、その構成を変更したりすると、VS Code はサーバーを (再) 起動して、それが提供するツールを検出する必要があります。

チャットビューから、または他の起動オプションを使用して、MCP サーバーを手動で再起動できます。

Screenshot showing the Refresh button in the Chat view.

または、chat.mcp.autostart 設定 (実験的) を使用して、構成の変更が検出されたときに VS Code が MCP サーバーを自動的に再起動するように構成します。

コマンドライン構成

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

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

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 サーバーを追加したり、その構成を変更したりする場合、起動する前にサーバーとその機能を信頼することを確認する必要があります。初めてサーバーを起動するとき、VS Code はサーバーを信頼するかどうかを確認するダイアログを表示します。ダイアログの MCP サーバーへのリンクを選択して、別のウィンドウで MCP サーバー構成を確認します。

Screenshot showing the MCP server trust prompt.

サーバーを信頼しない場合、サーバーは起動されず、チャットリクエストはサーバーが提供するツールを使用せずに続行されます。

コマンドパレットから MCP: 信頼のリセット コマンドを実行することで、MCP サーバーの信頼をリセットできます。

mcp.json ファイルから直接 MCP サーバーを起動した場合、サーバー構成を信頼するようには求められません。

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

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

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

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

MCP 出力ログ

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

MCP Server Error

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

MCP Server Error Output

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

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

  • watch: ファイルの変更を監視し、MCP サーバーを再起動するファイルグロブパターン。
  • debug: MCP サーバーでデバッガーを設定できます。
{
  "servers": {
    "gistpad": {
      "command": "node",
      "args": ["build/index.js"],
     "dev": {
       "watch": "build/**/*.js",
       "debug": { "type": "node" }
     },

現在、それぞれ nodepython で起動された Node.js および Python サーバーのデバッグのみをサポートしています。

よくある質問

どの MCP ツールを使用するか制御できますか?

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

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

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

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

「リクエストごとに 128 個を超えるツールを持つことはできません」というエラーが表示されます。

モデルの制約により、チャットリクエストでは一度に最大 128 個のツールしか有効にできません。128 個を超えるツールが選択されている場合は、チャットビューのツールピッカーで一部のツールまたはサーバー全体を選択解除してツールの数を減らすか、仮想ツールが有効になっていることを確認してください (github.copilot.chat.virtualTools.threshold)。

Screenshot showing the Chat view, highlighting the Tools icon in the chat input and showing the tools Quick Pick where you can select which tools are active.