Next Devtools MCP

by vercel

Connects coding agents to running Next.js 16+ dev servers for runtime errors, routes, logs, docs, and browser automation guidance.

Developer Tools
832stars
No ratings
UpdatedSep 15, 2026

InstallRepository Website

Install Next Devtools MCP

Pick your client, then add it in one click or paste the config.

STDIONode.js

~/Library/Application Support/Claude/claude_desktop_config.json

claude_desktop_config.json

{
  "mcpServers": {
    "vercel-next-devtools-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "next-devtools-mcp@latest"
      ]
    }
  }
}

Settings → Developer → Edit Config, merge this into mcpServers, then fully quit and reopen Claude Desktop.

We couldn’t confirm it starts correctly

We ran the install command but it didn't respond within our test window — this can mean a slow first-time install rather than a real problem.

npx -y next-devtools-mcp@latest

No response to initialize.

This is an experimental automated check and can have false negatives — missing environment variables, a slow cold install, etc. It doesn’t necessarily mean something’s wrong. Last checked 1mo ago.

Overview

The vercel/next-devtools-mcp MCP server connects coding agents to running Next.js development servers. It discovers Next.js 16+ servers and proxies their built-in `/_next/mcp` endpoint for errors, routes, logs, metadata, and Server Actions. It also points agents to version-matched documentation in the installed Next.js package and provides setup guidance for the `agent-browser` CLI. Reach for it when an agent needs live development-state information from a Next.js application rather than only static project files.

Use cases

Inspect errors in a running Next.js application
Discover routes and page metadata during development
Review development server logs through an agent
Find documentation matching the installed Next.js version
Set up browser automation guidance with agent-browser

Key features

Discovers running Next.js development servers
Proxies runtime errors, routes, logs, and metadata
Resolves Server Action IDs to source files
Locates version-specific bundled Next.js docs
Guides agents toward agent-browser CLI usage

Tools4

What Next Devtools MCP lets your agent do. Expand a tool for its parameters.

Self-reported~104 tokens of context

Security & health

What it can reach and how reliably it runs — from our own checks, not the maintainer’s claims.

ActiveLast checked Today

Recent health check succeeded.

18/19 checks healthy over the last 78d

Supply-chain signal

No high-severity advisories surfaced by our automated scan.

Critical 0High 0Medium 0Low 0

Scanned 5d ago via OSV.dev · next-devtools-mcp@latest (npm)

Adoption & maintenance

Factual signals from GitHub, npm, and our automated checks — not a rating.

GitHub stars832Stargazers on the source repository.

npm downloads296kPackage downloads in the last 30 days.

Last commit1mo agoMost recent push to the default branch.

Install checkInconclusiveDidn't respond in our test window — often a slow first install.

Tools exposed4Callable tools this server registers over MCP.

Directory activity1 upvotesConfig copies, upvotes, and views on AllMCPs.

How Next Devtools MCP works

What vercel/next-devtools-mcp MCP server does

The vercel/next-devtools-mcp MCP server connects an MCP-compatible coding agent with local Next.js development servers. Its primary role is discovery and forwarding: it finds running Next.js 16+ servers, lists the runtime tools exposed by each one, and sends requested calls to the selected server.

Runtime results can include current build, runtime, and type errors; development logs; route and page metadata; project metadata; and the source file associated with a Server Action ID. The server also exposes two gateways. One identifies the version-specific documentation bundled inside a project’s node_modules/next/dist/docs/ directory, while the other reports how to use the agent-browser command-line tool for browser automation.

How it works

Start a Next.js development process, such as with npm run dev, before requesting runtime information. Next.js 16+ exposes its MCP endpoint at /_next/mcp, and the connector scans common ports to locate available servers. No project or server URL configuration is needed for the automatic discovery flow.

Agents normally call nextjs_index first. The response includes discovered server details such as port, process ID, URL, and available runtime tools. They can then pass the selected port and a runtime tool name to nextjs_call; an optional arguments object is available when that runtime tool needs parameters.

The gateway tools do not fetch documentation or execute browser actions through MCP. nextjs_docs returns the local documentation path and reading instructions, and browser_eval detects whether agent-browser is installed or returns installation guidance. The agent then performs those tasks directly.

Setup and configuration

Install the npm package with a client configuration that runs npx -y next-devtools-mcp@latest. The project documents setup for clients including Cursor, Claude Code, Codex, Gemini, Google Antigravity, VS Code/Copilot, and Warp. Node.js 20.19 or a newer LTS release is required, along with npm or pnpm.

After adding the MCP server to the client, launch the Next.js development server. Runtime discovery and calls require a running Next.js 16+ application. The documentation gateway uses the installed Next.js package; for older Next.js versions, it recommends the latest Next.js upgrade codemod.

Tools and capabilities

nextjs_index scans for running Next.js development servers and lists their runtime MCP tools.
nextjs_call invokes a named runtime tool on a discovered server using its port.
nextjs_docs locates version-accurate documentation bundled with Next.js.
browser_eval checks for agent-browser and provides the command or installation steps needed to use it.

Limitations and notes

The vercel/next-devtools-mcp MCP server is a thin connector, so live runtime capabilities depend on a reachable Next.js 16+ development server. The gateway tools are pointers rather than document fetchers or browser drivers. Upgrade and Cache Components workflows are no longer implemented as server tools; they are distributed as agent skills.

Anonymous telemetry records tool names, anonymous error messages, session metadata, and basic environment details. It does not collect code, file contents or paths, personal data, credentials, or tool arguments. Local telemetry files are stored under ~/.next-devtools-mcp/. Set NEXT_TELEMETRY_DISABLED=1 to opt out, and remove that directory to delete local telemetry data.

Read the full README View source on GitHub

Reviews

No reviews yet — be the first to share how it worked for you.

Frequently Asked Questions about Next Devtools MCP

Configure the client to run `npx -y next-devtools-mcp@latest`, or use a client-specific MCP setup command documented by the project.

Its runtime discovery and runtime calls require Next.js 16 or newer with a running development server. The docs gateway recommends an upgrade path for older versions.

Call `nextjs_index` to discover a server, then call `nextjs_call` with its port and a runtime tool such as `get_errors` or `get_page_metadata`.

Yes. The README provides a Cursor MCP configuration using `npx -y next-devtools-mcp@latest`.

Related MCP servers

All in Developer Tools All alternatives

Add a badge to your READMEShow it’s listed — live SVG, Markdown or HTML.

AllMCPs Directory Badge

Full Badge Customizer

Showcase your server listing on GitHub or your project documentation. Embed this dynamic SVG badge to highlight official listing status and live engagement.

Badge Style:

Live Dynamic SVG Preview

Next Devtools MCP AllMCPs Directory Badge

Markdown (GitHub README)

[![AllMCPs](https://allmcps.com/api/badge/vercel-next-devtools-mcp?style=directory)](https://allmcps.com/mcp/vercel-next-devtools-mcp)

HTML Embed

<a href="https://allmcps.com/mcp/vercel-next-devtools-mcp"><img src="https://allmcps.com/api/badge/vercel-next-devtools-mcp?style=directory" alt="Next Devtools MCP on AllMCPs" /></a>