MCP server
Next.js DevTools MCP Server
- Maintainer
- Official · Vercel
- Runs
- Local (stdio)
- GitHub
- ★ 832, last push 2026-09-15 (checked 2026-10-24)
- Registry
- io.github.vercel/next-devtools-mcp
- Connects to
- Next.js
- DevHunt
- Vercel on DevHunt
Install the Next.js DevTools MCP Server
Pick your client. Each tab starts the same local command. Config shapes checked against each client's docs on 2026-10-25.
Run in a terminal. Everything after -- is the command that starts the server. docs
claude mcp add --transport stdio next-js-devtools -- npx -y next-devtools-mcp@latest
Claude Desktop only: Settings > Developer > Edit Config opens claude_desktop_config.json. Add this, save and restart the app. docs
{
"mcpServers": {
"next-js-devtools": {
"command": "npx",
"args": [
"-y",
"next-devtools-mcp@latest"
]
}
}
}Add to ~/.cursor/mcp.json (all projects) or .cursor/mcp.json (this project), or use the install button. docs
{
"mcpServers": {
"next-js-devtools": {
"command": "npx",
"args": [
"-y",
"next-devtools-mcp@latest"
]
}
}
}Add to .vscode/mcp.json (note the "servers" key and the type), or use the install button. Command Palette > "MCP: Open User Configuration" for all workspaces. docs
{
"servers": {
"next-js-devtools": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"next-devtools-mcp@latest"
]
}
}
}Run codex mcp add next-js-devtools -- npx -y next-devtools-mcp@latest, or add this to ~/.codex/config.toml. docs
[mcp_servers.next-js-devtools] command = "npx" args = ["-y", "next-devtools-mcp@latest"]
Run in a terminal (-s user adds it for all projects; the default is this project). docs
gemini mcp add -s user next-js-devtools npx -- -y next-devtools-mcp@latest
Run in a terminal; it writes ~/.copilot/mcp-config.json. docs
copilot mcp add next-js-devtools -- npx -y next-devtools-mcp@latest
Add to mcp_config.json: ~/.config/devin/mcp_config.json on macOS and Linux (older installs: ~/.codeium/windsurf/mcp_config.json), %APPDATA%\devin\ on Windows. docs
{
"mcpServers": {
"next-js-devtools": {
"command": "npx",
"args": [
"-y",
"next-devtools-mcp@latest"
]
}
}
}Add to Zed's settings.json (or Settings > AI > MCP Servers > Add Server). Remote servers without an Authorization header sign in with OAuth. docs
{
"context_servers": {
"next-js-devtools": {
"command": "npx",
"args": [
"-y",
"next-devtools-mcp@latest"
]
}
}
}Add to opencode.json in the project (or ~/.config/opencode/opencode.json). docs
{
"$schema": "https://opencode.ai/config.json",
"mcp": {
"next-js-devtools": {
"type": "local",
"command": [
"npx",
"-y",
"next-devtools-mcp@latest"
],
"enabled": true
}
}
}Add to ~/.kiro/settings/mcp.json (all projects) or .kiro/settings/mcp.json (this project). docs
{
"mcpServers": {
"next-js-devtools": {
"command": "npx",
"args": [
"-y",
"next-devtools-mcp@latest"
]
}
}
}MCP Servers > Configure > Configure MCP Servers opens cline_mcp_settings.json; add this entry. docs
{
"mcpServers": {
"next-js-devtools": {
"command": "npx",
"args": [
"-y",
"next-devtools-mcp@latest"
]
}
}
}Security notes
- The local server runs with your user's permissions (npx downloads it from npm on first run). The package is pinned to @latest, so each start can pull a new version; pin a version if you want to review updates.
Alternatives
- Context7official · ★ 64k
Current, version-specific docs and code examples for thousands of libraries, pulled into the prompt.
- Angular CLIofficial · ★ 27k
Angular best practices, docs search and project info, built into the Angular CLI.
- Microsoft Learnofficial · ★ 2k
Search and fetch official Microsoft and Azure documentation and code samples.
- Postgres AI guideofficial · ★ 1.9k
PostgreSQL docs and best practices (schema design, indexes, extensions) for the model to search.
- Refofficial · ★ 1.2k
Token-efficient search over public and private documentation.
- Svelteofficial · ★ 334
Svelte 5 and SvelteKit docs plus a code checker that suggests fixes.
- AWS Documentationofficial
Search, read and get recommendations from AWS documentation.
- DeepWikiofficial
Ask questions about any public GitHub repo, answered from DeepWiki's generated docs.
Comparing servers for one product? Next.js MCP servers
FAQ
What does the Next.js DevTools MCP Server do?+
Next.js docs, upgrade helpers and live errors and routes from your running dev server.
Is the Next.js DevTools MCP server official?+
Official: built and maintained by Vercel.
How do I add Next.js DevTools to Claude Code?+
Run: claude mcp add next-js-devtools -- npx -y next-devtools-mcp@latest. Add --scope project to share it with your team through .mcp.json.
How do I use the Next.js DevTools MCP server in Cursor or VS Code?+
Open the Cursor or VS Code tab above: it has the mcp.json entry and a one-click install link. Cursor uses the "mcpServers" key; VS Code uses "servers" and needs a type ("stdio").
Does Next.js DevTools work in ChatGPT and claude.ai?+
No: it runs locally over stdio, and ChatGPT and claude.ai only connect to remote servers. Use it in Claude Desktop, Claude Code, Cursor, VS Code or another client that can start a local process.
What are the alternatives to the Next.js DevTools MCP server?+
Other documentation MCP servers: Context7, Angular CLI, Microsoft Learn, Postgres AI guide and Ref.