VS Code Setup

Connect Visual Studio Code to n8n MCP Bridge using the MCP extension.

Prerequisites

• VS Code installed
• n8n MCP Bridge running
• MCP API key created

Installation

Step 1: Install MCP Extension

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

Step 2: Configure Extension

1. Open VS Code Settings (Cmd/Ctrl+,)
2. Search for "MCP"
3. Find "MCP: Servers" setting
4. Click "Edit in settings.json"

Add this configuration:

{
  "mcp.servers": {
    "n8n": {
      "url": "http://localhost:3001/mcp?apiKey=mcp_your_key_here"
    }
  }
}

Step 3: Reload VS Code

1. Press Cmd/Ctrl+Shift+P
2. Type "Reload Window"
3. Press Enter

Verification

Test the connection:

1. Open Command Palette (Cmd/Ctrl+Shift+P)
2. Type "MCP: Test Connection"
3. Select "n8n"
4. Should show "Connected ✓"

Using MCP in VS Code

In Chat

Use VS Code's AI chat:

@mcp Can you ping my n8n instance?

In Terminal

Some extensions allow terminal integration:

mcp n8n ping_n8n

Configuration Options

Multiple Servers

{
  "mcp.servers": {
    "n8n-prod": {
      "url": "https://mcp.example.com/mcp?apiKey=mcp_prod"
    },
    "n8n-dev": {
      "url": "http://localhost:3001/mcp?apiKey=mcp_dev"
    }
  }
}

Workspace-Specific

Create .vscode/settings.json in your project:

{
  "mcp.servers": {
    "n8n": {
      "url": "http://localhost:3001/mcp?apiKey=mcp_project_key"
    }
  }
}

Troubleshooting

Extension Not Found

If MCP extension isn't available:

• Check VS Code version (may require recent version)
• Look for alternative extensions
• Use Claude Desktop instead

Connection Failed

1. Verify MCP server is running: curl http://localhost:3001/health
2. Check API key in settings.json
3. Reload VS Code window
4. Check extension logs

Next Steps

• Set up Cursor IDE →
• Learn About OAuth Flow →
• View Troubleshooting Guide →