VS Code 1.99 introduces Model Context Protocol support.
Visual Studio Code ( VS Code
The Model Context Protocol (MCP) was formally introduced in version 1.99. MCP
) support. MCP is an open standard designed to provide a unified interface that allows AI models to interact with external tools and services.
MCP
was introduced primarily to enhance the GitHub Copilot The MCP server can be configured in Agent mode. With this protocol, developers can configure the MCP server to plug customized tools and services into the VS Code
in AI workflows, greatly expanding the potential of AI assistants to perform a wider range of more dynamic tasks, such as querying real-time data, manipulating local files, or invoking specific API
The
Prerequisites: Enable Agent mode and environment dependencies
VS Code
1.99 will MCP
Integrated with GitHub Copilot in the Agent mode. Therefore, to use the MCP
function, Agent mode must first be enabled. This can be done with the VS Code
The drop-down menu at the top of the Chat view does this.
Another thing to keep in mind, and MCP
A common feedback that is being faced is that running MCP
The server may require pre-installation of Node.js
, Docker
or other dependencies. This is because many MCP
Server implementations (especially for executing scripts or containerized tools) rely on these external environments. While this adds complexity to the initial setup, it also provides the flexibility to connect a variety of powerful customization tools.
Configuring the MCP Server
exist VS Code
Middle.MCP
The core configuration is located in the Workspace's .vscode/mcp.json
within the file. By means of this JSON
file, you can define one or more MCP
servers, Agent mode will use the tools provided by these servers.
Step 1: Create an MCP profile
- Open your project folder on
VS Code
Center. - In the project root directory, find or create a file named
.vscode
of the folder. - exist
.vscode
folder, create a file namedmcp.json
of the document. - Add the following basic configuration template to the
mcp.json
Documentation:{ "servers": { "example-server": { "type": "stdio", "command": "node", "args": ["path/to/your/script.js"] } } }
In this configuration:
servers
: An object that defines all theMCP
servers, each key is a unique server name (e.g. "example-server").type
: Specifies the type of communication for the server. Common types include:stdio
: The server is connected to the server via Standard Input/Output (SIO).VS Code
communication, typically used to run local scripts or executables.sse
: The server communicates using Server-Sent Events, which are commonly used for connecting to remote services or services that need to push updates on a continuous basis.
command
cap (a poem)args
: Defines the commands and their parameters needed to start this server. In this example, it will use theNode.js
to run a specifiedJavaScript
Documentation.
Step 2: Add Server-Specific Configuration
You can manually edit the mcp.json
file to add a server, or you can use the VS Code
The convenient way provided by the Command Panel:
- Open command panel (shortcut)
Ctrl+Shift+P
maybeCmd+Shift+P
). - Type and run
MCP: Add Server
Command. - option
Workspace Settings
(math.) genusVS Code
will automatically open or create.vscode/mcp.json
file and may provide intelligent prompts (IntelliSense) to help you with the configuration.
The following is a configuration named fetch
example of a server that uses the uvx
command to run mcp-server-fetch
A tool designed to retrieve the content of a web page at a specified URL:
{
"servers": {
"fetch": {
"type": "stdio",
"command": "uvx",
"args": ["mcp-server-fetch"]
}
}
}
Step 3: Secure handling of sensitive information
Hardcoding in the configuration file API
Keys or other sensitive credentials are not secure.MCP
The use of Input Variables is supported to handle this situation. When VS Code
The user is prompted for input when starting a server that requires these variables.
{
"inputs": [
{
"type": "promptString",
"id": "api-key",
"description": "Your API Key",
"password": true
}
],
"servers": {
"perplexity": {
"type": "stdio",
"command": "docker",
"args": ["run", "-i", "--rm", "-e", "PERPLEXITY_API_KEY", "mcp/perplexity-ask"],
"env": {
"PERPLEXITY_API_KEY": "${input:api-key}"
}
}
}
}
In this example:
inputs
Arrays define variables that require user input. Here aID
because ofapi-key
of the password type entered.password: true
Ensure that the content is hidden as you type.- In the server configuration of the
env
Part.${input:api-key}
The syntax references a previously defined input variable.VS Code
will be responsible for securely storing and passing this value to the server process's environment variablePERPLEXITY_API_KEY
The
Using and Managing MCP Tools
Enabling Agent Mode and Discovering Tools
When you have properly configured the .vscode/mcp.json
file and save it, then switch to the GitHub Copilot
Agent Mode (selected via the drop-down menu at the top of the Chat view) Agent
). the Agent mode automatically detects and loads the servers defined in the configuration file and the tools they provide.
invocation tool
Once servers and tools are recognized by the Agent schema, you can invoke them in the Chat view, either through natural language or specific commands. For example:
- If you configured the
fetch
server that can be entered:@workspace /fetch https://bytenote.net
to get the content of the page. - If you configure a time-query capable
MCP
server, try asking:@workspace What's the time in Saigon?
The Agent parses your request, determines whether it needs to invoke an external tool, and communicates with the appropriate MCP
server interaction to get the results.
Managing Server Status
Sometimes you need to view the status of a configured server or to manage it (start, stop, view logs, etc.).
- Open the command panel (
Ctrl+Shift+P
maybeCmd+Shift+P
). - Type and run
MCP: List Servers
Command. - This opens up a view listing all of the files in the
mcp.json
The server and its current state (e.g.Started
,Stopped
). - You can click on a server in the list to perform actions such as starting, stopping, or restarting it, and view its output logs, which is useful for debugging server configurations.
Advanced Configuration Example
Configuring multiple servers
mcp.json
The file can define multiple servers, each providing different functionality.
{
"inputs": [
{
"type": "promptString",
"id": "perplexity-key",
"description": "Perplexity API Key",
"password": true
}
],
"servers": {
"Perplexity": {
"type": "stdio",
"command": "docker",
"args": ["run", "-i", "--rm", "-e", "PERPLEXITY_API_KEY", "mcp/perplexity-ask"],
"env": {
"PERPLEXITY_API_KEY": "${input:perplexity-key}"
}
},
"Fetch": {
"type": "stdio",
"command": "uvx",
"args": ["mcp-server-fetch"]
},
"RemoteServer": {
"type": "sse",
"url": "http://api.example.com/sse",
"headers": {
"VERSION": "1.2"
}
}
}
}
This configuration defines three servers:
Perplexity
: UseDocker
Running a tool that might be used to perform complex searches or quizzes requires theAPI
Key.Fetch
: Useuvx
Run a local tool for crawling web content.RemoteServer
: Connect to a remoteSSE
A service endpoint that may be used to receive real-time notifications or data streams. Notesse
Type requiredurl
parameter and can contain customheaders
The
Using predefined variables
MCP
The configuration supports a number of predefined variables for easy referencing of contextual information.
{
"servers": {
"filesystem": {
"type": "stdio",
"command": "npx",
"args": ["@modelcontextprotocol/server-filesystem", "${workspaceFolder}"]
}
}
}
In this example, the${workspaceFolder}
is a predefined variable that will be replaced with the current VS Code
The root directory path of the open workspace. This is useful for tools that need access to project files.
pass (a bill or inspection etc) MCP
(math.) genusVS Code
opens the door for developers to integrate AI assistants more deeply into their daily development workflow with the power of external tools. While the initial configuration may involve some environment setup, the customization and capability expansion that comes with it is considerable.