DevLogs MCP

Give your AI assistant direct access to VS Code logs — no more copy-pasting from DevTools.

Disclaimer: This is an early prototype, not a polished product. The API and features may change based on feedback and use cases. The documentation was mostly written by a LLM, so may not be accurate. Contributions are welcome!

DevLogs MCP is a VS Code extension that captures logs from Output channels, the Extension Host, and Webview panels, then exposes them as tools via the Model Context Protocol (MCP). Your AI assistant can query your logs directly during a conversation.

How it works

Your VS Code workspace
  ├── Output channels  ──┐
  ├── Extension Host   ──┼──▶  DevLogs MCP buffer  ──▶  Local MCP server (HTTP/SSE :3939)
  └── Webview panels   ──┘                                       │
                                                                  ▼
                                              Claude Desktop · GitHub Copilot · claude.ai

Installation

Install from the VS Code Marketplace, or clone and press F5 to run in development:

git clone https://github.com/your-org/devlogs-mcp
cd devlogs-mcp
npm install
npm run compile
# Press F5 in VS Code

The MCP server starts automatically on port 3939. A status bar item ⊕ MCP :3939 confirms it is running.

Connecting your AI assistant

Claude Desktop

Claude Desktop has native MCP support and is the simplest integration.

1. Open the config file

2. Add the server

{
  "mcpServers": {
    "devlogs-mcp": {
      "url": "http://127.0.0.1:3939/sse"
    }
  }
}

Tip: click the ⊕ MCP :3939 status bar item — VS Code will show this snippet ready to copy.

3. Restart Claude Desktop

The tools (get_logs, get_log_summary, etc.) will appear in Claude's tool list. Try: "Are there any errors in my VS Code logs?"

GitHub Copilot (VS Code)

GitHub Copilot in VS Code supports MCP servers via the agent mode configuration introduced in VS Code 1.99.

1. Open your VS Code settings.json

Ctrl+Shift+P → Preferences: Open User Settings (JSON)

2. Register the MCP server

{
  "github.copilot.chat.mcp.servers": {
    "devlogs-mcp": {
      "type": "sse",
      "url": "http://127.0.0.1:3939/sse"
    }
  }
}

3. Use it in Copilot Chat

Open the Copilot Chat panel (Ctrl+Alt+I), switch to Agent mode (the @ icon → Agent), then ask:

"@devlogs-mcp What errors appeared in the last minute?"

Copilot will call get_logs or get_log_summary automatically when your question implies log access.

Note: MCP support in GitHub Copilot requires VS Code ≥ 1.99 and the GitHub Copilot Chat extension ≥ 0.26. If you don't see Agent mode, update both.

Claude (claude.ai — browser)

The claude.ai web interface supports MCP via the Claude Desktop connector — the browser tab delegates tool calls to your locally running Claude Desktop app, which in turn calls our server.

Prerequisites: Claude Desktop must be running and already configured with DevLogs MCP (see the Claude Desktop section above).

Steps:

1. Open claude.ai in your browser.
2. Start a new conversation.
3. Click the Tools (🔧) icon in the message bar.
4. If the DevLogs MCP server appears in the list, enable it — Claude will now call it during the conversation.

Note: This requires a Claude Pro or Team plan. The connector is only active while Claude Desktop is open on the same machine.

MCP Tools reference

How screen capture works

get_screen_screenshot uses the OS native tool on each platform — no Electron API, no Playwright, no extra runtime needed:

On macOS 10.15+ the process needs the Screen Recording permission. VS Code will have this if you have ever shared your screen from it — otherwise macOS will prompt on first use.

On Linux without a display server (headless CI), get_screenshot_info will tell you the capture is unavailable before you attempt it.

Example prompts

• "Show me the last 20 errors from my project output channel"
• "Summarise what changed in the logs since I last asked"
• "Are there any unhandled promise rejections in the webview?"
• "What warnings appeared in the Extension Host in the last 5 minutes?"
• "Take a screenshot — I want you to see what the player looks like right now"
• "My project stalled — grab a screenshot and check the logs"

Capturing Webview logs

By default, browser-side console.* calls inside webview panels are not visible to VS Code. To forward them, inject the bridge script at the top of your webview HTML:

import { getInjectionScript, registerWebviewPanel } from './webviewBridge';

const html = `<!DOCTYPE html><html><head>
  <script>${getInjectionScript()}</script>
</head><body>...</body></html>`;

panel.webview.html = html;
context.subscriptions.push(registerWebviewPanel(panel, 'my-panel-id'));

After this, console.error('project stall') inside the webview appears in the MCP log store under source webview, channel my-panel-id, and is queryable by any connected AI.

Settings

Commands

Troubleshooting

Status bar shows ⊕ MCP error Port 3939 is already in use. Change devlogsMcp.port in settings to another value (e.g. 3940) and update your AI config to match.

Copilot doesn't call the tools Make sure you are in Agent mode in Copilot Chat, not the default inline chat. Agent mode is required for MCP tool calls.

Claude Desktop doesn't show the tools Verify the config JSON is valid (no trailing commas), then fully quit and relaunch Claude Desktop — a simple window close is not enough on macOS.

Webview logs are missing Confirm you called both getInjectionScript() in the HTML and registerWebviewPanel() in your extension code, and that enableScripts: true is set on the webview options.

get_screen_screenshot fails on macOS Go to System Settings → Privacy & Security → Screen Recording and enable it for VS Code (or your terminal if running the extension in development).

get_screen_screenshot fails on Linux Run get_screenshot_info first. If it says no tool is available, install scrot: sudo apt install scrot. On a headless machine the capture is not possible by design.

Contributing

See docs/CONTRIBUTING.md. Issues and PRs welcome — this extension is designed to be useful for any VS Code extension developer.

Licence

MIT