StudyDiary/10-WebClipper/Use MCP servers in VS Code.md at 126486b0cd3c7a540e1b7919f615387352f9a719

gtAdmin/StudyDiary

Fork 0

Files

T

CrazyJasonwell 513b68be8c first commit

2026-07-23 20:36:13 +08:00

27 KiB

Executable File

Raw Blame History

title, source, author, published, created, description, tags, updated

title

source

author

published

created

description

在 VS Code 中使用 MCP 服务器

模型上下文协议（MCP）是一种开放标准，允许 AI 模型通过统一的界面使用外部工具和服务。在 VS Code 中，MCP 服务器为文件作、数据库或与外部 API 交互等任务添加了工具。

本文将指导你在 Visual Studio Code 中设置 MCP 服务器和使用具有代理模式的工具。

MCP 如何工作？

MCP 遵循客户端-服务器架构：

MCP 客户端 （如 VS Code）连接到 MCP 服务器并代表 AI 模型请求作
MCP 服务器 提供一种或多种工具，通过定义明确的接口公开特定功能
模型上下文协议 定义了客户端和服务器之间通信的消息格式，包括工具发现、调用和响应处理

例如，文件系统 MCP 服务器可能提供用于读取、写入或搜索文件和目录的工具。GitHub 的 MCP 服务器提供了列出存储库、创建拉取请求或管理问题的工具。MCP 服务器可以在计算机上本地运行或远程托管，VS Code 支持这两种配置。

通过标准化这种交互，MCP 消除了每个 AI 模型和每个工具之间自定义集成的需要。这使您只需将新的 MCP 服务器添加到您的工作区即可扩展 AI 助手的功能。了解有关模型上下文协议规范的更多信息。

VS Code 中支持的 MCP 功能

VS Code 支持以下 MCP 功能：

MCP 服务器传输：本地标准输入/输出（）、HTTP 流（）和服务器发送的事件（旧版支持）。 stdio http sse
MCP 功能：工具、提示、资源、引出、采样和身份验证。
VS Code 使用（ spec ）为服务器提供当前工作区文件夹。 roots

注意

从 VS Code 1.102 开始，VS Code 中的 MCP 支持已正式发布。

先决条件

安装最新版本的 Visual Studio Code
访问 Copilot

在 VS Code 中启用 MCP 支持

您可以使用 VS Code 中的 MCP 支持已启用聊天.mcp.enabled 设置。默认情况下，MCP 支持处于启用状态。

集中管理 MCP 支持

您可以通过两种方式集中管理组织中的 MCP 支持：

设备管理 ：通过组策略或配置文件集中启用或禁用组织中的 MCP 支持。详细了解如何使用设备管理管理 VS Code 设置。
GitHub Copilot 策略 ：使用 GitHub Copilot 策略控制组织中 MCP 服务器的可用性。在 GitHub Copilot 文档中详细了解管理企业中 Copilot 的策略和功能。

添加 MCP 服务器

谨慎

MCP 服务器可以在您的计算机上运行任意代码。仅添加来自受信任来源的服务器，并在启动之前查看发布者和服务器配置。首次启动 MCP 服务器时，VS Code 会提示您确认您信任 MCP 服务器。阅读有关在 VS Code 中使用 AI 的安全文档，了解其含义。

在 VS Code 中添加 MCP 服务器有多个选项：

直接从 Web 安装 MCP 服务器

网站可以提供直接在 VS Code 中安装 MCP 服务器的链接，从而轻松添加服务器，而无需手动配置服务器。

例如，要从 MCP 服务器的精选列表中安装 MCP 服务器：

打开“扩展”视图，然后在搜索栏中输入。 @mcp
选择浏览 MCP 服务器以 在浏览器中打开 MCP 服务器列表。或者，从命令面板运行 MCP：浏览服务器 命令。
选择“在任何 MCP 服务器上 安装” ，这将打开 VS Code 并显示服务器详细信息页。
在服务器详细信息页上选择 “安装” ，将 MCP 服务器添加到 VS Code 实例。 MCP 服务器安装在您的用户配置中，可以在任何工作区中使用。将 MCP 服务器添加到工作区

要为特定工作区配置 MCP 服务器，您可以在工作区文件夹中创建一个文件。然后，项目团队成员可以使用相同的服务器配置。.vscode/mcp.json

重要

确保避免使用输入变量或环境文件对敏感信息（如 API 密钥和其他凭据）进行硬编码。

要将 MCP 服务器添加到工作区，请执行以下作：

在工作区中创建一个文件。.vscode/mcp.json
选择“ 添加服务器 ”按钮，为新服务器添加模板。VS Code 为 MCP 服务器配置文件提供 IntelliSense。以下示例演示如何配置 GitHub 远程 MCP 服务器。详细了解 VS Code 中的 MCP 配置格式。 JSON
```
{
  "servers": {
    "github-mcp": {
      "type": "http",
      "url": "https://api.githubcopilot.com/mcp"
    }
  }
}
```
或者，从命令面板中运行 MCP：添加服务器 命令，选择要添加的 MCP 服务器类型并提供服务器信息。接下来，选择 “工作区设置 ”以在工作区中创建文件（如果该文件尚不存在）。.vscode/mcp.json 将 MCP 服务器添加到您的用户配置中

要为所有工作区配置 MCP 服务器，您可以将服务器配置添加到用户配置中。这允许您在多个项目中重复使用相同的服务器配置。

要将 MCP 添加到您的用户配置中，请运行 MCP：打开用户配置 命令，这将在您的用户配置文件中打开该文件。如果该文件不存在，VS Code 会为您创建该文件。 mcp.json

或者，使用命令面板中的 MCP：添加服务器 命令，提供服务器信息，然后选择全局将服务器配置添加到配置文件中。

当您使用多个 VS Code 配置文件时，这允许您根据活动配置文件在不同的 MCP 服务器配置之间切换。例如， Playwright MCP 服务器可以在 Web 开发配置文件中配置，但不能在 Python 开发配置文件中配置。

MCP 服务器在配置的位置执行。如果您连接到远程计算机并希望服务器在远程计算机上运行，则应在远程设置（ MCP：打开远程用户配置 ）或工作区的设置中定义它。在用户设置中定义的 MCP 服务器始终在本地执行。

将 MCP 服务器添加到开发容器

可以通过该文件在开发容器中配置 MCP 服务器。这允许您将 MCP 服务器配置作为容器化开发环境的一部分。 devcontainer.json

要在开发容器中配置 MCP 服务器，请将服务器配置添加到以下部分： customizations.vscode.mcp

JSON

{

  "image": "mcr.microsoft.com/devcontainers/typescript-node:latest",

  "customizations": {

    "vscode": {

      "mcp": {

        "servers": {

          "playwright": {

            "command": "npx",

            "args": ["-y", "@microsoft/mcp-server-playwright"]

          }

        }

      }

    }

  }

}

创建开发容器后，VS Code 会自动将 MCP 服务器配置写入远程文件，使其在容器化开发环境中可用。 mcp.json

自动发现 MCP 服务器

VS Code 可以自动检测并重用您在其他工具（例如 Claude Desktop）中定义的 MCP 服务器。

使用 chat.mcp.discovery.enabled 设置。

当 VS Code 首次启动 MCP 服务器时，它会发现服务器的功能和工具。然后，您可以在代理模式下使用这些工具。VS Code 缓存 MCP 服务器的工具列表。要清除缓存的工具，请使用命令面板中的 MCP：重置缓存工具 命令。

查看已安装的 MCP 服务器

要查看和管理已配置的 MCP 服务器列表，请执行以下作：

从命令面板运行 MCP：显示已安装的服务器 命令以打开 MCP 服务器视图。或者，直接打开扩展视图（ ⇧⌘X ）中的 MCP 服务器 - 已安装 部分。
从命令面板中运行 MCP：列出服务器 命令以查看已安装的 MCP 服务器的列表。

在代理模式下使用 MCP 工具

添加 MCP 服务器后，您可以在代理模式下使用它提供的工具。

要在代理模式下使用 MCP 工具：

打开聊天视图（ ⌃⌘I ），然后从下拉列表中选择代理模式。
选择 “工具” 按钮以查看可用工具的列表。（可选）选择或取消选择要使用的工具。您可以通过在搜索框中键入内容来搜索工具。重要一个聊天请求一次最多可以启用 128 个工具。如果选择的工具超过 128 个，请通过在工具选取器中取消选择某些工具来减少工具数量，或确保启用虚拟工具（ github.copilot.chat.virtualTools.threshold).
在聊天输入框中输入提示，并注意如何根据需要自动调用工具。例如，安装 GitHub MCP 服务器并询问“列出我的 GitHub 问题”。提示您还可以通过键入后跟工具名称来直接在提示中引用工具。您可以在所有聊天模式（询问、编辑和代理模式）中执行此作。 #
出现提示时，请在确认之前仔细查看工具调用详细信息。谨慎 MCP 工具可能会在您的计算机上本地运行，并可以执行修改文件或数据的作。始终确保您了解该工具作的含义。使用 “继续” 按钮下拉选项自动确认当前会话、工作区或所有未来调用的特定工具。
（可选）在运行工具之前验证和编辑工具输入参数。

使用 MCP 资源

除了工具之外，MCP 服务器还可以提供资源，您可以将其用作聊天提示中的上下文。例如，文件系统 MCP 服务器可能提供对文件和目录的访问，或者数据库 MCP 服务器可能提供对数据库表的访问。

要将资源从 MCP 服务器添加到聊天提示中：

在聊天视图中，选择添加 上下文 > MCP 资源
从列表中选择资源类型，并提供可选的资源输入参数。

To view the list of available resources for an MCP server, use the MCP: Browse Resources command or use the MCP: List Servers > Browse Resources command to view resources for a specific server.

MCP tools can return resources as part of their response. You can view or save these resources to your workspace by selecting Save or by dragging and dropping the resource to the Explorer view.

Use MCP prompts

MCP servers can provide preconfigured prompts for common tasks, so you don't have to type an elaborate chat prompt. You can directly invoke these prompts in the chat input box by typing followed by the prompt name, formatted as . Optionally, the prompt might ask you for extra input parameters./ mcp.servername.promptname

Use MCP elicitations

MCP servers can request extra input from you through elicitations. When an MCP server needs more information to complete a task, it can prompt you for specific details, such as confirmations, configuration values, or other parameters required for the operation.

When an MCP server sends an elicitation request, VS Code presents you with a dialog or input field where you can provide the requested information. This allows MCP servers to gather necessary data dynamically without requiring all configuration to be set up in advance.

As you add more MCP servers, the list of tools can become long. This can make it tedious to manage individual tools, for example when you want to define a reusable prompt file or a custom chat mode.

To help you manage tools, you can group related tools into a tool set. A tool set is a collection of individual tools that you can refer to as a single entity. A tool set can contain built-in tools, MCP tools, or tools provided by extensions.

Learn more about how to create and use tool sets in VS Code.

Manage MCP servers

You can perform various actions on the installed MCP servers, such as starting or stopping a server, viewing the server logs, uninstalling the server, and more.

To perform these actions on an MCP server, use either of these options:

Right-click on the server in the MCP SERVERS - INSTALLED section or select the gear icon
Open the configuration file and access the actions inline in the editor (lenses) mcp.json Use the MCP: Open User Configuration or MCP: Open Workspace Folder Configuration commands to access the MCP server configuration.
Run the MCP: List Servers command from the Command Palette and select a server

Automatically start MCP servers

When you add an MCP server or change its configuration, VS Code needs to (re)start the server to discover the tools it provides.

You can configure VS Code to automatically restart the MCP server when configuration changes are detected by using the chat.mcp.autostart setting (Experimental).

Alternatively, manually restart the MCP server from the Chat view, or by selecting the restart action from the MCP server list.

Command-line configuration

You can also use the VS Code command-line interface to add an MCP server to your user profile or to a workspace.

To add an MCP server to your user profile, use the command line option, and provide the JSON server configuration in the form .--add-mcp {\"name\":\"server-name\",\"command\":...}

Bash

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

URL handler

VS Code also includes a URL handler that you can use to install an MCP server. To form the URL, construct an object in the same format as you would provide to , and then create the link by using the following logic:obj --add-mcp

TypeScript

// For Insiders, use \`vscode-insiders\` instead of \`code\`

const link = \`vscode:mcp/install?${encodeURIComponent(JSON.stringify(obj))}\`;

This link can be used in a browser, or opened on the command line, for example via on Linux.xdg-open $LINK

Find MCP servers

MCP is still a relatively new standard, and the ecosystem is rapidly evolving. As more developers adopt MCP, you can expect to see an increasing number of servers and tools available for integration with your projects.

The curated list of MCP servers on the VS Code website is a great starting point. Choose from different categories and directly install MCP servers in VS Code.

MCP's official server repository provides official, and community-contributed servers that showcase MCP's versatility. You can explore servers for various functionalities, such as file system operations, database interactions, and web services.

VS Code extensions can also contribute MCP servers and configure them as part of the extension's installation process. Check the Visual Studio Marketplace for extensions that provide MCP server support.

MCP server trust

MCP servers can run arbitrary code on your machine. Only add servers from trusted sources, and review the publisher and server configuration before starting it. Read the Security documentation for using AI in VS Code to understand the implications.

When you add an MCP server to your workspace or change its configuration, you need to confirm that you trust the server and its capabilities before starting it. VS Code shows a dialog to confirm that you trust the server when you start a server for the first time. Select the link to MCP server in the dialog to review the MCP server configuration in a separate window.

If you don't trust the server, it is not started, and chat requests continue without using the tools provided by the server.

You can reset trust for your MCP servers by running the MCP: Reset Trust command from the Command Palette.

Note

If you start the MCP server directly from the file, you are not prompted to trust the server configuration.mcp.json

Synchronize MCP servers across devices

With Settings Sync enabled, you can synchronize settings and configurations across devices, including MCP server configurations. This allows you to maintain a consistent development environment and access the same MCP servers on all your devices.

To enable MCP server synchronization with Settings Sync, run the Settings Sync: Configure command from the Command Palette, and ensure that MCP Servers is included in the list of synchronized configurations.

Configuration format

MCP servers are configured using a JSON file () that defines two main sections: server definitions and optional input variables for sensitive data.mcp.json

MCP servers can connect using different transport methods. Choose the appropriate configuration based on how your server communicates.

Configuration structure

The configuration file has two main sections:

"servers": {} - Contains the list of MCP servers and their configurations
"inputs": [] - Optional placeholders for sensitive information like API keys

You can use predefined variables in the server configuration, for example to refer to the workspace folder ().${workspaceFolder}

Standard I/O (stdio) servers

Use this configuration for servers that communicate through standard input and output streams. This is the most common type for locally-run MCP servers.

Field	Required	Description	Examples
`type`	Yes	Server connection type	`"stdio"`
`command`	Yes	Command to start the server executable. Must be available on your system path or contain its full path.	`"npx"`, , , `"node"` `"python"` `"docker"`
`args`	No	Array of arguments passed to the command	`["server.py", "--port", "3000"]`
`env`	No	Environment variables for the server	`{"API_KEY": "${input:api-key}"}`
`envFile`	No	Path to an environment file to load more variables	`"${workspaceFolder}/.env"`

Note

When using Docker with stdio servers, don't use the detach option (). The server must run in the foreground to communicate with VS Code.-d

Example local server configuration

This example shows the minimal configuration for a basic, local MCP server using :npx

JSON

{

  "servers": {

    "memory": {

      "command": "npx",

      "args": ["-y", "@modelcontextprotocol/server-memory"]

    }

  }

}

HTTP and Server-Sent Events (SSE) servers

Use this configuration for servers that communicate over HTTP. VS Code first tries the HTTP Stream transport and falls back to SSE if HTTP is not supported.

Field	Required	Description	Examples
`type`	Yes	Server connection type	`"http"`, `"sse"`
`url`	Yes	URL of the server	`"http://localhost:3000"`, `"https://api.example.com/mcp"`
`headers`	No	HTTP headers for authentication or configuration	`{"Authorization": "Bearer ${input:api-token}"}`

Example remote server configuration

This example shows the minimal configuration for a remote MCP server without authentication:

JSON

{

  "servers": {

    "context7": {

      "type": "http",

      "url": "https://mcp.context7.com/mcp"

    }

  }

}

Input variables for sensitive data

Input variables let you define placeholders for configuration values, avoiding the need to hardcode sensitive information like API keys or passwords directly in the server configuration.

When you reference an input variable using , VS Code prompts you for the value when the server starts for the first time. The value is then securely stored for subsequent use. Learn more about input variables in VS Code.${input:variable-id}

Input variable properties:

Field	Required	Description	Example
`type`	Yes	Type of input prompt	`"promptString"`
`id`	Yes	Unique identifier to reference in server config	`"api-key"`, `"database-url"`
`description`	Yes	User-friendly prompt text	`"GitHub Personal Access Token"`
`password`	No	Hide typed input (default: false)	`true` for API keys and passwords

Example server configuration with input variables

This example configures a local server that requires an API key:

JSON

{

  "inputs": [

    {

      "type": "promptString",

      "id": "perplexity-key",

      "description": "Perplexity API Key",

      "password": true

    }

  ],

  "servers": {

    "perplexity": {

      "type": "stdio",

      "command": "npx",

      "args": ["-y", "server-perplexity-ask"],

      "env": {

        "PERPLEXITY_API_KEY": "${input:perplexity-key}"

      }

    }

  }

}

Server naming conventions

When defining MCP servers, follow these naming conventions for the server name:

Use camelCase for the server name, such as "uiTesting" or "githubIntegration"
Avoid using whitespace or special characters
Use a unique name for each server to avoid conflicts
Use a descriptive name that reflects the server's functionality or brand, such as "github" or "database"

Troubleshoot and debug MCP servers

MCP output log

When VS Code encounters an issue with an MCP server, it shows an error indicator in the Chat view.

Select the error notification in the Chat view, and then select the Show Output option to view the server logs. Alternatively, run MCP: List Servers from the Command Palette, select the server, and then choose Show Output.

Debug an MCP server

You can enable development mode for MCP servers by adding a key to the MCP server configuration. This is an object with two properties:dev

watch: A file glob pattern to watch for files change that will restart the MCP server.
debug: Enables you to set up a debugger with the MCP server.

JSON

{

  "servers": {

    "gistpad": {

      "command": "node",

      "args": ["build/index.js"],

     "dev": {

       "watch": "build/**/*.js",

       "debug": { "type": "node" }

     },

Note

We currently only support debugging Node.js and Python servers launched with and respectively.node python

Frequently asked questions

Can I control which MCP tools are used?

Select the Tools button in the Chat view when in agent mode, and toggle specific tools on/off as needed.
Add specific tools to your prompt by using the Add Context button or by typing .#
For more advanced control, you can use to fine-tune tool usage..github/copilot-instructions.md

The MCP server is not starting when using Docker

Verify that the command arguments are correct and that the container is not running in detached mode ( option). You can also check the MCP server output for any error messages (see Troubleshooting).-d

A chat request can have a maximum of 128 tools enabled at a time due to model constraints. If you have more than 128 tools selected, reduce the number of tools by deselecting some tools or whole servers in the tools picker in the Chat view, or ensure that virtual tools are enabled (github.copilot.chat.virtualTools.threshold).

27 KiB Executable File Raw Blame History Unescape Escape

在 VS Code 中使用 MCP 服务器

先决条件

在 VS Code 中启用 MCP 支持

集中管理 MCP 支持

添加 MCP 服务器

查看已安装的 MCP 服务器

在代理模式下使用 MCP 工具

使用 MCP 资源

Use MCP prompts

Use MCP elicitations

Manage MCP servers

Automatically start MCP servers

Command-line configuration

URL handler

Find MCP servers

MCP server trust

Synchronize MCP servers across devices

Configuration format

Configuration structure

Standard I/O (stdio) servers

HTTP and Server-Sent Events (SSE) servers

Input variables for sensitive data

Server naming conventions

Troubleshoot and debug MCP servers

MCP output log

Debug an MCP server

Frequently asked questions

Can I control which MCP tools are used?

The MCP server is not starting when using Docker

27 KiB

Executable File

Raw Blame History