MCP Generator
VS Code extension that:
- embeds an internal MCP config at
resources/mcp.json
- generates
contributes.languageModelTools in package.json by querying all MCP servers
- on activation, starts those servers and proxies each VS Code tool invocation to the right MCP server/tool.
Edit resources/mcp.json:
{
"servers": {
"brop-mcp": {
"command": "npx",
"args": ["@borgius/brop-mcp@latest"],
"transport": { "type": "stdio", "framing": "ndjson" }
}
}
}
Supported stdio framings:
content-length (default)
ndjson
Run:
npm run update-tools
This starts all servers from resources/mcp.json, calls MCP tools/list, and rewrites package.json.contributes.languageModelTools.
Generated tool IDs use a friendly format (for example brop_cdp_navigate). Each contributed tool also includes explicit routing metadata (mcpServer and mcpTool) so the extension knows which MCP server and tool to invoke at runtime.
Run/debug
npm run compile
- Press
F5 to launch the extension host.
Note: some MCP servers (like browser automation servers) may require an external app/extension (e.g. Chrome extension) connected before tool calls succeed.
Using this repository as a template ✅
You can use this project as a starting point when creating your own VS Code extension that exposes MCP-backed tools. Below are step-by-step instructions and examples to help you fork, customize, test, and publish your extension.
Copilot-assisted setup (recommended)
If you’re using this repo as a template and want the fastest path to “my extension with my MCP tools”, you can let GitHub Copilot do the customization for you.
Clone your fork and open it in VS Code.
Open Copilot Chat.
Type @init-extension and describe what you want. For example:
@init-extension Set up my extension with:
- name: my-browser-tools
- displayName: My Browser Tools
- publisher: mycompany
- description: Browser automation tools for VS Code
- GitHub owner: @myhandle
- MCP server: npx @anthropic/mcp-server-puppeteer
The init-extension agent is defined in .github/agents/init-extension.md.
Answer any follow-up questions. Copilot will:
- update
package.json metadata
- update
.github/CODEOWNERS
- write
resources/mcp.json
- run
npm install, npm run update-tools, and npm run compile
Review the diff before publishing.
Manual
Use GitHub's Use this template button or fork the repo to create your own copy.
Clone your fork locally and install dependencies:
git clone <your-repo-url>
cd <your-repo-folder>
npm install
Update extension metadata in package.json: change at minimum the name, displayName, description, and publisher fields so your extension is uniquely identified.
Example:
{
"name": "my-mcp-extension",
"displayName": "My MCP Extension",
"description": "My custom tools backed by MCP servers",
"publisher": "your-publisher-id"
}
Configure MCP servers in resources/mcp.json. Each server needs a command (or absolute path), optional args, and a transport definition.
Example (using npx):
{
"servers": {
"my-server": {
"command": "npx",
"args": ["@example/my-mcp-server@latest"],
"transport": { "type": "stdio", "framing": "ndjson" }
}
}
}
Tip: If your command is not on the GUI PATH (common on macOS), either use the absolute command path (e.g. /opt/homebrew/bin/npx) or launch VS Code from a terminal so it inherits your shell PATH.
Generate tool contributions and write them into package.json:
npm run update-tools
This starts the servers, calls tools/list and rewrites contributes.languageModelTools with friendly tool IDs and routing metadata (mcpServer / mcpTool).
Build and test:
- Build:
npm run compile
- Run in development: Press
F5 to start the extension host and exercise the tools.
- Tests:
npm test
Publish (optional):
Install vsce or use @vscode/vsce to package and publish the extension.
Typical steps:
npm install -g vsce
vsce package
vsce publish
Make sure your publisher is set and you have created a publisher on the VS Code Marketplace.
Common customization & tips
- Tool ID naming: The generator uses
serverShort_toolName (e.g., brop_cdp_navigate). You can rename later in package.json, but keep mcpServer and mcpTool metadata pointing to the original MCP tool.
- PATH issues: If servers fail to spawn with
ENOENT, either launch VS Code from a terminal or set command to an absolute path, or add an env entry into resources/mcp.json.
- External dependencies: Some MCP servers require external components (e.g., browser extensions, running browsers). Document prerequisites in your README.
- Security: Never commit secrets or private keys into
resources/mcp.json. Use environment variables instead and document how to supply them locally or via CI.
Template checklist
- Fork or use this template
- Update
package.json metadata (name, displayName, publisher, description)
- Edit
resources/mcp.json to include your servers
- Run
npm install then npm run update-tools
- Build & test:
npm run compile + F5, npm test
- Update README with project-specific instructions and prerequisites
- Package & publish when ready
A GitHub Actions workflow is included at .github/workflows/ci.yml; it runs compile, tests, and validates update-tools. The workflow also includes an optional auto-commit step (runs on pushes to the default branch) that will commit package.json changes when update-tools updates the contributed tools — edit or remove that step if you prefer manual commits.
Prefer editing resources/mcp.example.json while getting started and copy it to resources/mcp.json in your fork when ready. See TEMPLATE.md for a concise onboarding checklist. Use the interactive helper to scaffold a forked project quickly: npm run init-extension — it updates package.json, writes resources/mcp.json, and updates .github/CODEOWNERS for you. Update .github/CODEOWNERS with your GitHub handle if you prefer to do it manually.