Skip to main content

Using MCP in Visual Studio Code

Visual Studio Code supports the Model Context Protocol (MCP) through several paths, allowing AI agents to use tools from your HasMCP servers directly in your editor.

1. Native Agent Mode (GitHub Copilot)

1

Generate a Token

In the HasMCP dashboard, go to your server and click Generate Token.
2

Add Server

Open the Command Palette (Ctrl+Shift+P or Cmd+Shift+P), type and select MCP: Add Server, then choose HTTP (Http or Server-Sent Events).
3

Configure

  • Enter a name for your server (e.g., hasmcp-db).
  • Select Workspace Settings to create a .vscode/mcp.json file.
  • Enter your HasMCP server URL (e.g., https://app.hasmcp.com/mcp/<SERVER_ID>).
4

Add Authentication

Open the generated .vscode/mcp.json and add the headers object with your token:
{
  "servers": {
    "hasmcp-server": {
      "type": "http",
      "url": "https://app.hasmcp.com/mcp/<SERVER_ID>",
      "headers": {
        "x-hasmcp-key": "Bearer <YOUR_ACCESS_TOKEN>"
      }
    }
  }
}

2. Extensions (Cline / Roo Code)

1

Open Configuration

Click the MCP icon (a plug or network icon) in the extension’s sidebar, then click Configure MCP Servers or Edit Global Config. This opens the configuration JSON file.
2

Add Server

Add your HasMCP server using the Remote MCP (Bridge) format since most local extensions prefer stdio execution:
{
  "mcpServers": {
    "myServer": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "https://app.hasmcp.com/mcp/<SERVER_ID>",
        "--header",
        "x-hasmcp-key: Bearer ${HASMCP_MCP_ACCESS_TOKEN}"
      ],
      "env": {
        "HASMCP_MCP_ACCESS_TOKEN": "YOUR_TOKEN_VALUE"
      }
    }
  }
}

Verifying Connections

  • In Native Mode: Open the Chat panel, select Agent Mode, and click the 🛠️ (tools) icon. Your HasMCP server and its tools should appear in the list.
  • In Extensions: The MCP sidebar tab will show a green status indicator once the server is successfully initialized.

Troubleshooting

If using native VS Code support, ensure you are on version 1.101 or later for full remote MCP compatibility.
You can view detailed connection logs by selecting your server in the MCP: List Servers view or checking the Output panel in VS Code.