Connect VSCode to an MCP Server
This guide explains how to connect an MCP server to VSCode with Copilot, allowing you to interact with your API using natural language directly within the Copilot interface.
You can connect VSCode with Copilot to:
- A locally generated MCP server created with liblab.
- A publicly deployed MCP server accessible via a URL.
Before You Start
Before connecting VSCode with Copilot to your MCP server, make sure you have:
- The VSCode editor installed.
- The GitHub Copilot Chat extension installed and enabled in VSCode.
- One of the following:
- A local MCP server generated with liblab CLI.
- A publicly deployed MCP server URL generated on your liblab dashboard.
To learn more about how MCP works, visit the MCP Concept page.
Connect VSCode to a Remote MCP Server
Use this method if your MCP server is deployed and accessible over the internet through an URL. If you generated your MCP server using the liblab hosting service, use this option.
-
Open VSCode.
-
Navigate to File > Preferences > Settings (or press
Ctrl + ,
). -
In the search bar, type
MCP
. For the option Mcp: Model Context Protocol server configurations, click Edit in settings.json. -
VSCode will open the
settings.json
file. You'll see an example MCP configuration under themcp
object:settings.json...
"mcp": {
"inputs": [],
"servers": {
"mcp-server-time": {
"command": "python",
"args": [
"-m",
"mcp_server_time",
"--local-timezone=America/Los_Angeles"
],
"env": {}
}
}
},
... -
Add your MCP server configuration using the hosted MCP URL. Replace the placeholder URL (
https://mcp.liblab.com/liblab-dev
) with your actual values, then save the file:settings.json...
"mcp": {
"servers": {
"your-mcp-server": {
"command": "npx",
"args": [
"-y",
"your-mcp-server-url"
],
"env": {
"YOUR_API_KEY": "<your-api-key>"
}
}
}
}
... -
A Start button will appear for your MCP server configuration. Click it to launch the server.
-
To test the integration, open a new Copilot Chat window (
Ctrl+Alt+I
) and select Agent Mode. Start chatting to interact with your API. Copilot will detect if you’re using a registered tool from your MCP server and prompt you for permission to execute it.
Add Environment Variables for Authentication
If your MCP requires authentication—such as an API key, you can set environment variables that Copilot will use when making requests to your API. This is done by restarting the MCP using the restart_sdk
tool, a built-in utility available in all MCPs generated by liblab.
To set a new environment variable:
- Start a new chat using Copilot using the previously connected MCP.
- Ask Copilot to restart the MCP and provide the environment variable and its value.
Here’s an example where an API key is passed as an environment variable. Note that the variable name (e.g. apiKey
) and value format depend on the specific API used to generate the MCP:
restart the mcp and use the apiKey:<your-api-key>
Copilot will recognize the intent to use the restart_sdk
tool and apply the environment variable. All future requests will then include this authentication data.
Enable MCP Tools in VSCode using Copilot
To enable MCP tools, open a chat in Agent Mode and click the Select Tools icon. VSCode will show the MCP servers and their available tools. Use the checkboxes to enable the ones you want.
Using MCP tools
You can specify the MCP tool you want to use in your chat by typing #
followed by the tool name. If you don't know the tools available, you can type #
and Copilot will suggest the tools from your MCP server and provide a brief description for each one.
Connect VSCode to a Local MCP Server
Use this method if you're running the MCP server locally, generated from an OpenAPI spec using liblab.
If you haven’t yet generated your MCP server, follow the Generate an MCP Server with liblab guide.
After generating the server using the liblab CLI, navigate to the output folder and run:
cd output/mcp
npm run setup
Now, you need to update VSCode's settings:
-
Open VSCode.
-
Go to File > Preferences > Settings (or press
Ctrl + ,
). -
Search for
MCP
. Click Edit in settings.json under the Mcp: Model Context Protocol server configurations setting. -
VSCode will open the
settings.json
file. You can add the following configuration for your local MCP server. Replace the placeholder URL and environment variables with your actual values, then save the file.settings.json...
"mcp": {
"servers": {
"your-mcp-server": {
"command": "node",
"args": [
"<path-to-liblab-generated-mcp-server>/output/mcp/dist/index.js"
],
"env": {
"YOUR_API_KEY": "<your-api-key>"
}
}
}
}
...MCP server authenticationMake sure to use the correct environment variable name expected by your API.
-
Once the config is saved, a Start button will appear next to your local MCP server. Click it to run the server.
-
Once the server is running, open a new Copilot Chat (
Ctrl+Alt+I
), enable Agent Mode, and start interacting. Copilot will identify available MCP tools and ask for permission before executing them.
Next Steps
To continue working with MCP and Copilot in VSCode, explore the following: