next-devtools-mcp is a Model Context Protocol (MCP) server that connects coding agents like Claude and Cursor to your running Next.js dev server.
Next.js DevTools source profile. From the maintainer documentation: “next-devtools-mcp is a Model Context Protocol (MCP) server that connects coding agents like Claude and Cursor to your running Next.js dev server.”
The documented npm package is next-devtools-mcp. The configuration below comes from the maintainer’s example; adapt its paths and account values to your environment.
Project documentation · Repository · Discovery listing. This profile records the public documentation checked on 2026-10-08.
Check the linked publisher documentation and your connected client's tool list. Names and availability can vary with the server version and account permissions.
| Tool | What it does |
|---|---|
| get_errors | current build, runtime, and type errors |
| get_logs | path to the dev log file (browser console + server output) |
| get_page_metadata | routes, pages, component metadata |
| get_project_metadata | project structure, config, dev server URL |
| get_server_action_by_id | resolve a Server Action ID to its source file |
| port | required) — dev server port |
| toolName | required) — runtime tool to invoke |
| args | optional) — arguments object, only if the tool requires them |
| 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). |
| nextjs_docs | Gateway. Point the agent at version-accurate docs in node_modules/next/dist/docs/. |
| browser_eval | Gateway. Point the agent at the agent-browser CLI for browser automation. |
{
"mcpServers": {
"next-devtools": {
"command": "npx",
"args": [
"-y",
"next-devtools-mcp@latest"
]
}
}
}From the project documentation. Replace placeholders and example paths before connecting.
Use Microsoft’s Playwright MCP server to navigate pages, inspect accessibility snapshots, fill forms and capture browser screenshots.
The original Chromium automation reference server — simple, screenshot-driven browser control.
Give your coding agent the full DevTools toolbox: traces, network, console, heap snapshots and Lighthouse.
Puppeteer-powered browser control that drives pages from the accessibility tree instead of pixels.
Enables AI-powered applications to monitor and interact with browser data via a Chrome extension and MCP.
Automates browsers and APIs, enabling Large Language Models (LLMs) to interact with web pages for tasks like screenshot capture and JavaScript