RELATED 01
JS Reverse MCP
Debug and reverse-engineer a web page's JavaScript in a visible Chrome, with breakpoints and network capture
3.1kGitHub stars
1.2k/wknpm downloads
77popularity score
Next.js DevTools MCP
Lets a coding assistant read errors, routes and logs from your running Next.js dev server
Official · Vercel TypeScript Local · stdio Developer tools
90 popularity score ★ 835 ↓ 160k/wk
Connect your client
Local (npm)
Add in one click
Opens the app, which asks before it adds the server.
Or add it by command or config
Claude CodeTerminal
claude mcp add next-js-devtools -- npx -y next-devtools-mcpClaude Desktopclaude_desktop_config.json
{
"mcpServers": {
"next-js-devtools": {
"command": "npx",
"args": [
"-y",
"next-devtools-mcp"
]
}
}
}Cursor~/.cursor/mcp.json
{
"mcpServers": {
"next-js-devtools": {
"command": "npx",
"args": [
"-y",
"next-devtools-mcp"
]
}
}
}VS Code.vscode/mcp.json
{
"servers": {
"next-js-devtools": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"next-devtools-mcp"
]
}
}
}Codex~/.codex/config.toml
[mcp_servers.next-js-devtools]
command = "npx"
args = ["-y", "next-devtools-mcp"]Gemini CLITerminal
gemini mcp add --scope user next-js-devtools npx -- -y next-devtools-mcpSettings 1
NEXT_TELEMETRY_DISABLED |
Optional: Set to 1 to opt out of anonymous usage telemetry. |
|---|
What it does
Next.js DevTools MCP connects coding assistants such as Claude, Cursor or Codex to a Next.js application running on your own machine. It finds running Next.js 16+ dev servers by scanning common local ports and passes calls through to the MCP endpoint that Next.js builds into its dev server at /_next/mcp. Through it the assistant can see current build, runtime and type errors, the route and page structure, project metadata, the path to the dev log, and which source file a Server Action ID belongs to.
Since version 0.4.0 it is a thin connector. Two of its tools are gateways: nextjs_docs points the assistant at the version-matched docs Next.js ships in node_modules/next/dist/docs/, and browser_eval tells the assistant how to install or start the separate agent-browser CLI for browser work. Neither does the work itself. The older docs-fetching, upgrade and Cache Components tools were removed and are now distributed as agent skills.
It needs Node.js 20.19 or newer and runs over stdio with npx next-devtools-mcp@latest. The runtime tools need a running Next.js 16+ dev server; the two gateway tools work without one. It is published by Vercel, the company behind Next.js, under the MIT license.
What it needs
| Runtime | Node.js |
|---|
Tools 4
nextjs_index- Discover running Next.js dev servers and list each one's runtime MCP tools.
nextjs_call- Call a runtime tool on a discovered server (errors, routes, logs, Server Actions), given its port and tool name.
nextjs_docs- Gateway: points the agent at the version-accurate docs bundled in node_modules/next/dist/docs/; does not fetch docs.
browser_eval- Gateway: detects the agent-browser CLI and returns how to install or run it; does not drive the browser.