Skip to main content

VS Code Integration

Connect MCPBundles MCP servers to VS Code to give Copilot and AI assistants access to external tools and APIs.

Requirements​

  • VS Code with MCP support (install MCP extension if needed)
  • An MCP server enabled in your MCPBundles dashboard
  • Credentials connected for the providers on that MCP server

Time to complete: 3-5 minutes

VS Code has an integrated terminal, so the fastest way to connect is via the MCPBundles CLI:

pip install mcpbundles
mcpbundles init

This automatically discovers your MCP servers, writes the VS Code MCP config, and handles authentication. No manual JSON editing needed.

Option B: Manual Config Setup​

1. Install MCP Extension (if needed)​

  1. Open VS Code
  2. Go to Extensions (Cmd/Ctrl + Shift + X)
  3. Search for "MCP" or "Model Context Protocol"
  4. Install the MCP extension
  5. Reload VS Code if prompted

2. Get your MCP server URL​

  1. Log in to MCPBundles Dashboard
  2. Open the MCP server you want to connect
  3. Scroll to the "Quick Setup" section (only visible when the MCP server is operational)
  4. Copy the MCP Server URL

3. Add MCP Server​

  1. Open Command Palette (Cmd/Ctrl + Shift + P)
  2. Type: "MCP: Add Server"
  3. Select HTTP as transport type
  4. Fill out the form:
    • URL: Your MCPBundles MCP server URL from step 2
    • Name: Your MCP server display name (e.g., "Marketing Automation")
    • Scope: Choose Global (all workspaces) or Workspace (this project only)
  5. Click Add or Save

4. Restart VS Code​

  1. Quit VS Code completely
  2. Reopen it
  3. Wait 10-20 seconds for MCP to initialize

5. Verify Connection​

  1. Open Command Palette
  2. Type: "MCP: List Servers"
  3. Your MCP server should appear in the list

Or ask Copilot: "What MCP tools do you have access to?"

Using Tools in VS Code​

Once connected, AI assistants can use your tools when relevant.

Example Prompts (with Copilot)​

Fetch data for development:

"Get the latest Smartlead campaigns and generate TypeScript interfaces for them"

GitHub operations:

"List my GitHub repos, find the one with the most stars, and show me recent commits"

CRM integration:

"Fetch the latest 20 HubSpot contacts and create a CSV import script"

Copilot will call tools, get real data, and use it for code generation.

Configuration Scopes​

Global Scope​

Pros:

  • Available in all VS Code workspaces
  • Configure once, use everywhere

Cons:

  • Tools accessible to all projects

Use when: You use the same tools across multiple projects.

Workspace Scope​

Pros:

  • Tools only available in this project
  • Different MCP servers per project
  • Team can share config via .vscode/mcp.json

Cons:

  • Need to configure per workspace

Use when: Different projects need different tools.

Troubleshooting​

"MCP server not responding"​

Cause: URL is invalid or the MCP server is disabled.

Fix:

  • Verify URL is exactly as shown in dashboard (including https://)
  • Confirm the MCP server is enabled (Dashboard → MCP servers)
  • Try removing and re-adding the server
  • Restart VS Code

Tools don't appear after adding server​

Cause: VS Code hasn't reloaded MCP config.

Fix:

  1. Quit VS Code completely
  2. Wait 5 seconds
  3. Reopen VS Code
  4. Wait 20 seconds for MCP to initialize
  5. Check "MCP: List Servers" again

"Authentication required" when calling tools​

Cause: Provider credentials not connected.

Fix:

  1. Go to Settings → Credentials
  2. Find the provider for that tool
  3. Click Connect and complete OAuth or add API key
  4. Try the tool again in VS Code

See Provider Credentials Guide.

Can't find "MCP: Add Server" command​

Cause: MCP extension not installed or enabled.

Fix:

  1. Extensions → Search "MCP"
  2. Install the MCP extension
  3. Reload VS Code
  4. Try the command again

Tools work but return empty data​

Cause: Connected to wrong account or no data exists.

Fix:

  1. Settings → Credentials → find [Provider] and expand it
  2. Check which account is connected
  3. If wrong, click Reconnect and use correct account
  4. Verify data exists in the provider's app

Advanced Configuration​

Multiple MCP servers​

Add multiple MCP servers:

  1. Command Palette → "MCP: Add Server"
  2. Add first MCP server
  3. Repeat for each additional MCP server

All tools from all MCP servers will be available.

Manual Config File​

You can also edit the config file directly:

Global config:

  • macOS/Linux: ~/.vscode/mcp.json
  • Windows: %APPDATA%\Code\User\mcp.json

Workspace config:

  • .vscode/mcp.json in your project root

Example:

{
  "mcpServers": {
    "marketing": {
      "url": "https://mcp.mcpbundles.com/bundle/abc123"
    },
    "dev-tools": {
      "url": "https://mcp.mcpbundles.com/bundle/def456"
    }
  }
}

Restart VS Code after editing.

With Other MCP Servers​

MCPBundles works alongside other MCP servers:

{
  "mcpServers": {
    "mcpbundles-marketing": {
      "url": "https://mcp.mcpbundles.com/bundle/abc123"
    },
    "local-filesystem": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-filesystem", "/path/to/files"]
    }
  }
}

Limitations​

VS Code MCP Constraints​

  • Extension limitations: Depends on MCP extension capabilities
  • Copilot integration: Works with current GitHub Copilot
  • Network required: Tools need internet access

MCP server readiness​

Copilot can only use tools from MCP servers with valid credentials:

  • Ready (with "Credentials valid" subtext) — all providers configured and working
  • Setup Required (needs provider configuration for some tools)

If your MCP server shows "Connection Error":

  1. Go to Dashboard → MCP servers → your MCP server
  2. Scroll to the "Credentials" section
  3. Find provider cards showing "Error" badges or marked "Not configured"
  4. Click "Add Credential" (or "Edit" if credential exists) on affected provider cards
  5. Add or update credentials in the credential panel
  6. Select validation tool and click "Validate Now"
  7. Restart VS Code after credentials are verified

Tips​

Workspace-specific MCP servers​

For team projects:

  1. Add the MCP server with Workspace scope
  2. Commit .vscode/mcp.json to git
  3. Team members get the config automatically
  4. Everyone has the same tools

Testing Before Adding​

  1. Add the MCP server with Workspace scope first
  2. Test in one project
  3. If it works, add with Global scope

Next Steps​

Need Help?​