Next.js DevTools MCP
Connects an agent to a running Next.js 16+ dev server: errors, routes, logs and docs for your installed version
Install
claude mcp add next-devtools npx next-devtools-mcp@latestThis is third-party code. Review the repository files before installing.
What it does
The server discovers running Next.js 16+ dev servers and proxies their built-in /_next/mcp endpoint. Through it the agent reads build and runtime errors, the route structure, project metadata, logs and the source of a Server Action by ID. The nextjs_docs tool points the agent to the docs bundled in node_modules with your installed Next.js version. The browser_eval tool tells the agent how to install and run the agent-browser CLI for in-browser checks.
Who it is for. For frontend developers who build Next.js apps together with an agent.
Good fit when
- The agent edits a Next.js app and should see real dev server errors
- You need a quick view of the project's routes
- The agent mixes up APIs from different Next.js versions
Not a fit when
- The project is on Next.js below 16: runtime tools do not work there
- The project does not use Next.js
Example request
What errors does my Next.js app have right now?Limitations
Requires Node.js 20.19+ and a running Next.js 16+ dev server, otherwise only the docs and browser guidance tools work. The server collects anonymous telemetry, which you can turn off with NEXT_TELEMETRY_DISABLED=1. No external keys or accounts are needed.
How to disable. Remove the next-devtools server from your MCP client config, for example claude mcp remove next-devtools.
MCP
- Transport
- stdio
- Authentication
- not required
| Environment variables | |
|---|---|
| NEXT_TELEMETRY_DISABLED | Set to 1 to turn off anonymous telemetry |
Security check
- Reads logs and metadata from the local dev server
- Sends anonymous telemetry
README in short
The README calls the server a thin connector to the MCP endpoint built into Next.js 16. It installs via npx add-mcp or a JSON config, with separate commands for Claude Code, Codex, Gemini, Amp and VS Code. It documents four tools, migration from 0.3 and opt-out telemetry. MIT licensed.
FAQ
Where did the Next.js 16 upgrade tools go?
They were removed in 0.4.0; migration workflows now ship as agent skills.
Do I need to configure a port?
No, nextjs_index scans common ports and finds running servers itself.
Related
Official Claude Code plugin from the Next.js repo: adopting Cache Components and Partial Prefetching, and verifying changes on a running dev server
Official shadcn/ui skill and MCP server: the agent searches registries, adds components via the CLI and follows the library's rules
A frontend design skill with 23 commands, live browser iteration and 61 detector rules for common AI-generated UI tells
Vercel Agent Skills
Agent Skills
Vercel's skills: React and Next.js performance, UI guideline audits, React Native, component composition and deploys