MCP Directory

How to add Next.js DevTools MCP to Cursor

Next.js development tools for coding agents: runtime diagnostics, upgrades, docs, and Cache Components migration. Paste the config into ~/.cursor/mcp.json and restart Cursor.

Last updated June 14, 2026 · 768★ · stdio · no auth · official

Cursor config for Next.js DevTools MCP

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

Setup steps

  1. 1Open Cursor → Settings → MCP → Add new MCP server (or edit ~/.cursor/mcp.json directly).
  2. 2Paste the Next.js DevTools MCP config below into the "mcpServers" object.
  3. 3Fill in placeholder secrets, then save.
  4. 4Cursor reloads MCP servers automatically — check Settings → MCP for a green status dot.
  5. 5Ask Cursor to use one of Next.js DevTools MCP's tools to confirm it's connected.

Before you start

  • Node.js v20.19 or a newer latest maintenance LTS version
  • npm or pnpm
  • Next.js 16+ with a running dev server (npm run dev) for runtime diagnostics tools (nextjs_index, nextjs_call); other tools work without a running server

What Next.js DevTools MCP can do in Cursor

init

Initialize Next.js DevTools MCP context, document available tools, and establish a documentation-first requirement (use nextjs_docs for all Next.js queries). Optional project_path input. Recommended at the start of every session.

nextjs_docs

Search and retrieve official Next.js documentation via a two-step process: 'search' for docs by keyword to get paths, then 'get' to fetch full markdown content by path. Supports filtering by router type (app, pages, all).

browser_eval

Automate and test web apps using Playwright. Actions include start, navigate, click, type, fill_form, evaluate, screenshot, console_messages, drag, upload_file, close, and list_tools. Supports chrome, firefox, webkit, msedge, headless mode.

nextjs_index

Discover all running Next.js 16+ dev servers on the machine and list the runtime diagnostic tools each exposes at its /_next/mcp endpoint (e.g. get_errors, get_logs, get_page_metadata, get_project_metadata, get_server_action_by_id). No parameters required.

nextjs_call

Execute a specific MCP tool on a running Next.js dev server's /_next/mcp endpoint. Requires port and toolName; optional args object. Use nextjs_index first to discover servers and tools.

upgrade_nextjs_16

Guide through upgrading Next.js to version 16 with automated codemod execution (requires clean git state). Handles async API changes, config migration, image defaults, parallel routes, deprecated API removals, and React 19 compatibility. Optional project_path input.

enable_cache_components

Complete Cache Components setup, enablement, and migration for Next.js 16 with automated error detection and fixing. Runs pre-flight checks, enables config, starts the dev server with MCP, verifies routes, sets up Suspense/caching boundaries, and runs final build testing. Optional project_path input.

Security

Collects anonymous usage telemetry (tool names invoked, anonymous error messages, session metadata like OS/Node version). Project code, file contents, file paths, credentials, and tool arguments are NOT collected. Local telemetry files are written under ~/.next-devtools-mcp/. Disable telemetry by setting NEXT_TELEMETRY_DISABLED=1.

Next.js DevTools MCP + Cursor FAQ

Where is the Cursor config file?

Cursor reads MCP servers from ~/.cursor/mcp.json. Paste the Next.js DevTools MCP config there under the "mcpServers" key and restart the client.

Is Next.js DevTools MCP safe to use with Cursor?

Collects anonymous usage telemetry (tool names invoked, anonymous error messages, session metadata like OS/Node version). Project code, file contents, file paths, credentials, and tool arguments are NOT collected. Local telemetry files are written under ~/.next-devtools-mcp/. Disable telemetry by setting NEXT_TELEMETRY_DISABLED=1.

Do I need Next.js 16 to use this server?

No. The documentation, upgrade, Cache Components, and browser_eval tools work with any Next.js version. The runtime diagnostics tools (nextjs_index and nextjs_call) require Next.js 16+ with a running dev server, since MCP is enabled by default at /_next/mcp in Next.js 16+.

Should I call any tool first?

Yes. The README strongly recommends calling the init tool at the start of every Next.js session to establish proper context and a documentation-first approach. You can also configure your agent (e.g. via CLAUDE.md or .cursorrules) to call init automatically.

What data does it collect?

It collects anonymous telemetry: which tools are invoked, anonymous error messages, and session metadata (session ID, timestamps, OS, Node version). It does NOT collect your code, file contents, file paths, credentials, or tool arguments. Set NEXT_TELEMETRY_DISABLED=1 to opt out.

View repo Full Next.js DevTools MCP page