MCP Tools for VS Code: Supercharging Your IDE
How to add MCP-powered AI tools directly into VS Code.
VS Code is the most popular code editor in the world, and MCP integration makes it even more powerful. With MCP tools in VS Code, your AI coding assistant can interact with external tools, databases, and APIs directly from the editor.
What MCP in VS Code Enables
Without MCP
- AI assistant can only see your code files
- Can't query databases or APIs
- Can't run external tools
- Limited to the editor's context
With MCP
- AI assistant can query your production database
- Can search your documentation site
- Can interact with your issue tracker
- Can run tests and analyze results
- Can access any MCP-compatible tool
Setting Up MCP in VS Code
Option 1: Continue Extension (Claude)
If you use Claude as your coding assistant:
// .vscode/mcp-config.json
{
"mcpServers": {
"database": {
"command": "node",
"args": ["./tools/db-mcp-server.js"],
"env": {
"DATABASE_URL": "${env:DATABASE_URL}"
}
},
"issue-tracker": {
"command": "python",
"args": ["./tools/jira-mcp-server.py"],
"env": {
"JIRA_TOKEN": "${env:JIRA_TOKEN}"
}
},
"docs": {
"url": "https://docs-mcp.example.com/sse",
"headers": {
"Authorization": "Bearer ${env:DOCS_TOKEN}"
}
}
}
}
Option 2: Custom MCP Client Extension
Build a VS Code extension that acts as an MCP client:
// extension.ts
import * as vscode from "vscode";
import { McpClient } from "@modelcontextprotocol/sdk";
export function activate(context: vscode.ExtensionContext) {
const client = new McpClient({
serverCommand: "node",
serverArgs: ["./mcp-server.js"],
});
// Register commands
context.subscriptions.push(
vscode.commands.registerCommand("mcp.queryDatabase", async () => {
const query = await vscode.window.showInputBox({
prompt: "Enter SQL query",
});
if (query) {
const result = await client.callTool("query_database", { sql: query });
displayResults(result);
}
})
);
// Register code lens for MCP-powered features
vscode.languages.registerCodeLensProvider("*", {
provideCodeLenses(document) {
return [
new vscode.CodeLens(
new vscode.Range(0, 0, 0, 0),
{ title: "$(database) Query with MCP", command: "mcp.queryDatabase" }
),
];
},
});
}
Option 3: Cursor IDE (Built-in MCP)
Cursor IDE has native MCP support:
# Add an MCP server to Cursor
cursor mcp add database-server -- node ./tools/db-mcp-server.js
cursor mcp add api-server -- python ./tools/api-mcp-server.py
Useful MCP Servers for VS Code
1. Database Explorer MCP
// db-mcp-server.ts
const server = new McpServer({ name: "db-explorer" });
server.tool("list_tables", {}, async () => {
const tables = await db.query("SHOW TABLES");
return tables.map(t => ({ name: t, rowCount: await getRowCount(t) }));
});
server.tool("describe_table", { table: z.string() }, async (args) => {
const schema = await db.query(`DESCRIBE ${args.table}`);
return { columns: schema };
});
server.tool("query", { sql: z.string(), limit: z.number().default(100) }, async (args) => {
const results = await db.query(args.sql.slice(0, args.limit));
return results;
});
server.tool("explain_plan", { sql: z.string() }, async (args) => {
const plan = await db.query(`EXPLAIN ANALYZE ${args.sql}`);
return plan;
});
2. Documentation Search MCP
# docs-mcp-server.py
@mcp_tool("search_docs")
async def search_docs(query: str, version: str = "latest"):
"""Search project documentation."""
results = await search_index(query, version)
return {
"results": results,
"suggestions": generate_related_queries(query),
}
@mcp_tool("get_code_example")
async def get_code_example(topic: str, language: str = "python"):
"""Find relevant code examples in documentation."""
examples = await find_examples(topic, language)
return {"examples": examples}
3. Git Intelligence MCP
server.tool("get_pr_context", {}, async () => {
const branch = await git.currentBranch();
const changes = await git.diff();
const commits = await git.log({ maxCount: 10 });
return {
branch,
changedFiles: changes.files,
commitHistory: commits,
relatedIssues: extractIssueNumbers(commits),
};
});
server.tool("suggest_reviewers", {}, async () => {
const files = await git.changedFiles();
const experts = await codeOwnership.analyze(files);
return { suggestedReviewers: experts };
});
4. Test Runner MCP
server.tool("run_tests", {
filter: z.string().optional(),
watch: z.boolean().default(false),
}, async (args) => {
const results = await runTestSuite(args.filter, args.watch);
return {
passed: results.passed,
failed: results.failed,
coverage: results.coverage,
failures: results.failures.map(f => ({
test: f.name,
error: f.error,
suggestion: await generateFix(f.error),
})),
};
});
5. API Tester MCP
server.tool("list_endpoints", {}, async () => {
const routes = await scanApiRoutes();
return routes.map(r => ({
method: r.method,
path: r.path,
auth: r.authRequired,
params: r.params,
}));
});
server.tool("test_endpoint", {
method: z.string(),
path: z.string(),
body: z.string().optional(),
}, async (args) => {
const response = await makeRequest(args.method, args.path, args.body);
return {
status: response.status,
body: response.data,
duration: response.duration,
valid: validateResponse(response, args.path),
};
});
Workflow Examples
Workflow 1: AI-Powered Code Review
1. Developer opens PR
2. MCP database tool checks if changes affect production schema
3. MCP docs tool verifies API changes match documentation
4. MCP test tool runs relevant tests
5. AI assistant synthesizes all findings into review comments
Workflow 2: Intelligent Debugging
1. Developer hits a bug
2. AI assistant uses MCP to query recent database changes
3. MCP git tool checks recent commits affecting this code
4. MCP test tool runs failing test with verbose output
5. AI assistant correlates all data and suggests fix
Workflow 3: Feature Development
1. Developer describes new feature
2. MCP issue tool fetches related tickets and requirements
3. MCP docs tool finds relevant API documentation
4. MCP database tool shows current schema
5. AI assistant generates implementation plan
MCP Tools on SkillExchange for VS Code
Browse ready-made MCP servers on SkillExchange:
| Category | Skills Available | Popular Examples |
|---|---|---|
| Database | 45+ | PostgreSQL Explorer, MongoDB Tools |
| Git/CI | 30+ | GitHub Intelligence, GitLab CI Helper |
| Testing | 25+ | Jest Runner, Pytest Helper, Cypress Guide |
| APIs | 40+ | OpenAPI Tester, GraphQL Explorer |
| Cloud | 35+ | AWS Navigator, GCP Helper, Azure Tools |
| Docs | 20+ | JSDoc Generator, Swagger Sync |
Configuration Tips
Environment Variables
// settings.json
{
"mcp.servers": {
"database": {
"env": {
"DB_HOST": "localhost",
"DB_PORT": "5432",
"DB_NAME": "myapp_dev"
}
}
}
}
Project-Specific MCP Config
// myproject/.vscode/mcp-config.json
{
"mcpServers": {
"project-db": {
"command": "node",
"args": ["./tools/db-server.js"],
"env": { "DB_URL": "postgresql://..." }
}
}
}
Global MCP Config
// ~/.vscode/mcp-global.json
{
"mcpServers": {
"general-tools": {
"url": "https://mcp.mycompany.com/sse"
}
}
}
Security Best Practices
- Never commit API keys β Use environment variables
- Restrict database access β Read-only for MCP database tools
- Sandbox execution β Run MCP servers in containers
- Audit tool calls β Log what the AI does with your tools
- Rate limit β Prevent runaway tool calls
Conclusion
MCP tools transform VS Code from a code editor into an AI-powered development environment where your coding assistant can access databases, APIs, documentation, and more. This context-aware approach dramatically improves the quality of AI-assisted development.
Learn More
- How to Build an MCP Server β Build your own
- MCP Protocol Explained β Deep dive
- Claude MCP Integration β Claude-specific guide
- Best AI Tools for Developers 2026
Browse MCP tools for your IDE on SkillExchange.