Using MCP servers in VS Code

Who this is for and what you will get

You already have an MCP server that runs, and you want it available inside your editor rather than in a separate terminal. By the end you should be able to write mcp.json in a project's .vscode folder, start the server from VS Code, and call its tools from GitHub Copilot Chat with a natural-language prompt. ^[1]

Why connect an MCP server to the IDE

Visual Studio Code and GitHub Copilot can act as MCP clients. The features of a server then become usable from inside the editor, and natural-language prompts can replace commands typed in a terminal. The example is GitHub's MCP server, which would let a user control GitHub through prompts. ^[1]

The approach has three steps: configure a file that tells VS Code where the server is, start or connect to the server so that it lists its capabilities, and use those capabilities through the GitHub Copilot Chat interface. ^[1]

Two ways to control a server

An MCP server can be controlled through the user interface or from the terminal with the code executable. To add a server to your user profile from the terminal, use the --add-mcp option with a JSON server configuration. The example is:

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

This adds a server named my-server that starts with the command uvx and the argument mcp-server-fetch. ^[1]

This design keeps the editor thin: what a server can do is decided by the server, and VS Code only discovers, lists and calls its tools. Clear tool descriptions therefore matter, because a prompt that matches its description triggers the tool. ^[1]

Setup: turn on MCP discovery

You may need to enable discovery of MCP servers first. In Visual Studio Code, go to File -> Preferences -> Settings, search for "MCP", and enable chat.mcp.discovery.enabled in the settings.json file. ^[1]

Step 1: create the config file

Create a .vscode folder in the project root and put an mcp.json file in it. The layout is:

.vscode
|-- mcp.json

Step 2: add a server entry

Put the following content in mcp.json:

{
    "inputs": [],
    "servers": {
       "hello-mcp": {
           "command": "node",
           "args": [
               "build/index.js"
           ]
       }
    }
}

The entry is named hello-mcp and starts a Node.js server at build/index.js. For a server in another runtime, put the right start-up command in command and args. ^[1]

The inputs array is empty in this example. The inputs array can prompt the user for values such as API keys, which are then passed to the MCP server when the entry is configured. ^[1]

The code of the hello-mcp server is not shown. A reader can connect their own server, or one of the calculator samples, which are provided in TypeScript, Python, Java, .NET and JavaScript. The same mcp.json can hold several server entries, each identified by its own name. ^[1]

Step 3: start the server and check its tools

Find the entry in mcp.json and click the "play" icon beside it. ^[1]

Once the server is running, the tools icon in GitHub Copilot Chat shows more available tools, and clicking it lists the registered tools. Each tool can be checked or unchecked to decide whether Copilot uses it as context. ^[1]

The screenshot captions describe a guided MCP server configuration in Visual Studio Code, tool selection for each agent session, and an easy way to debug errors during MCP development. ^[1]

Step 4: call a tool with a prompt

To run a tool, type a prompt that matches one of the tool descriptions. The example is "add 22 to 1", and the expected answer is 23. ^[1]

Common problems and limits

• The server does not start. A wrong start-up command means the server cannot list its tools. When you change runtimes, only command and args need to change, so check that the command runs in a terminal first. If the start fails, run the same command and args in a terminal to see whether the error comes from the server itself or from the VS Code configuration. ^[1]
• A tool is not used. Every tool can be unchecked individually, and an unchecked tool is not given to Copilot as context. ^[1]
• Keep secrets out of the file. Use inputs to ask for values such as API keys rather than writing them into the configuration. ^[1]
• A prompt does not trigger a tool. Tools are triggered by a prompt that matches their descriptions. If nothing happens, compare the prompt with the tool descriptions and check that the tool is ticked. ^[1]
• Network conditions and account setup for GitHub Copilot are outside the scope of this guide.

Next steps

Calculator samples in TypeScript, Python, Java, .NET and JavaScript are available for experimenting in VS Code. ^[1]

Visual Studio Code is a client that can consume several MCP servers and their tools, with the GitHub Copilot Chat interface as the place to interact with them. A useful exercise is to put a few entries in one mcp.json, start them one at a time, and compare the tools they offer. ^[1]

Adapted from lesson 4 of the introductory section of Microsoft's open-source course *mcp-for-beginners*, "Consuming a server from GitHub Copilot Agent mode"^[1], released under the MIT License.