Tutorial5 min readMay 5, 2026

How to Install an MCP Server on VS Code

VS Code ships MCP support inside its built-in chat agent. Drop a .vscode/mcp.json in your workspace, declare any tokens as password-type inputs, and the MCP's tools become available in Agent mode. No extension required.

Goal

Connect any MCP server to VS Code Agent mode

Time

~5 minutes

Prereq

Recent VS Code, Node.js for npx-based servers

Steps

Create .vscode/mcp.json at the workspace root

VS Code looks for an mcp.json under .vscode in every workspace. Create the file at your repo root if it does not exist. Commit it to share with the rest of the team — every contributor who opens the workspace gets the same MCPs.

Add servers under the "servers" key

VS Code uses "servers" instead of Claude Desktop's "mcpServers" — that is the only structural difference. Use ${workspaceFolder} to scope filesystem-style MCPs to the currently open project so the path follows the workspace.

{
  "servers": {
    "filesystem": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-filesystem",
        "${workspaceFolder}"
      ]
    }
  }
}

Use inputs for tokens, not raw env values

Declare a password-type input in mcp.json, reference it via ${input:id} inside env, and VS Code prompts on first use and stores the value in the OS keychain. The committed file holds only placeholders — even if it leaks, no secrets go with it.

{
  "inputs": [
    {
      "type": "promptString",
      "id": "github_pat",
      "description": "GitHub personal access token",
      "password": true
    }
  ],
  "servers": {
    "github": {
      "command": "npx",
      "args": ["@github/github-mcp-server"],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "${input:github_pat}"
      }
    }
  }
}

Enable from the Command Palette

Cmd/Ctrl+Shift+P → "MCP: List Servers". Toggle each server on. VS Code launches the server process and surfaces any startup error inline — wrong package name, missing env var, bad path. Fix the line, re-toggle, re-check.

Cmd/Ctrl+Shift+P → "MCP: List Servers"

Verify in Agent mode

Open the Chat view, switch to Agent mode, and the MCP tools appear under the Tools picker. The first time a server with an input is needed, VS Code prompts for the value — type the token once and it is encrypted and stored in the OS keychain for future runs.

Always declare tokens as inputs

Putting a token directly in the env block works but writes the secret to the committed mcp.json. Declaring an input — and referencing $${input:id} in env — keeps the secret in the OS keychain and the committed file clean. The slight extra setup is worth it; never go back to raw tokens once you have inputs working.

Sample .vscode/mcp.json

A minimal workspace config with three servers, using inputs for the GitHub token. Drop into your repo's .vscode/mcp.json.

.vscode/mcp.json

{
  "inputs": [
    {
      "type": "promptString",
      "id": "github_pat",
      "description": "GitHub personal access token",
      "password": true
    }
  ],
  "servers": {
    "filesystem": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-filesystem",
        "${workspaceFolder}"
      ]
    },
    "context7": {
      "command": "npx",
      "args": ["-y", "@upstash/context7-mcp"]
    },
    "github": {
      "command": "npx",
      "args": ["@github/github-mcp-server"],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "${input:github_pat}"
      }
    }
  }
}

When it does not work

MCP commands missing from the Command Palette

You are probably on an older VS Code build. MCP support is part of the built-in chat agent — update to the latest VS Code release. There is no separate extension to install.

${workspaceFolder} expanded to nothing

VS Code only expands ${workspaceFolder} when a folder is open as a workspace, not when you opened a single file. Open the parent folder via File → Open Folder and reload — the variable picks up the new path.

Token prompt appears every session

Either VS Code's secret storage is misbehaving (rare) or the input id changed between sessions. Run "MCP: Reset Cached Inputs" to wipe stored values, then re-enter once. Future sessions reuse the stored value silently.

FAQ

Do I need an extension for MCP in VS Code?

No. Modern VS Code includes MCP support directly in its built-in chat agent. If MCP commands are missing from your Command Palette, update to the latest release.

What is the difference between .vscode/mcp.json and settings.json mcp.servers?

.vscode/mcp.json is workspace-scoped — checked in alongside the repo so every contributor gets the same MCPs. settings.json mcp.servers is user-wide and applies across every workspace. The workspace file wins on name conflicts.

Can I share VS Code MCP config with Cursor users?

Almost. Cursor reads .cursor/mcp.json with "mcpServers" as the top-level key; VS Code reads .vscode/mcp.json with "servers". Copy-paste between the two requires only that rename — the rest of the shape is identical. Many teams commit both files.

Where are tokens entered via inputs actually stored?

In the OS-native secret store: Keychain on macOS, Credential Manager on Windows, Secret Service on Linux. VS Code reads them at server-launch time and never writes them to disk in cleartext.

Next steps

One server is wired up. Now pick the rest of the stack — the six MCPs every VS Code user should install.

Best MCPs for VS Code Secure your MCPs →