next-devtools-mcp

Overview

next-devtools-mcp is an MCP server created by Vercel that provides comprehensive Next.js development tools for coding agents like Claude and Cursor. It offers both runtime diagnostics for running Next.js applications and development automation features. The server provides tools for accessing Next.js documentation, performing browser automation, and managing development workflows. It's specifically designed to work with Next.js 16+ projects but also offers compatibility with earlier versions.

Try asking AI

After installing, here are 7 things you can ask your AI assistant:

• initinit(project_path?: string)

  Initialize Next.js DevTools MCP context and establish documentation requirements.

  Try:Initialize Next.js DevToolsTry:Set up context for my Next.js projectTry:Start working with my Next.js app
• nextjs_docsnextjs_docs(action: 'search'|'get', query?: string, path?: string, anchor?: string, routerType?: 'app'|'pages'|'all')

  Search and retrieve Next.js official documentation and knowledge base.

  Try:Search Next.js docs for metadataTry:Get documentation for generateStaticParamsTry:Show me Next.js middleware documentation
• browser_evalbrowser_eval(action: string, browser?: string, headless?: boolean, ...)

  Automate and test web applications using Playwright browser automation.

  Try:Take a screenshot of my Next.js appTry:Check console errors on my applicationTry:Click the login button on my website
• nextjs_indexnextjs_index()

  Discover all running Next.js dev servers and list their available MCP tools.

  Try:What Next.js servers are running?Try:Show me available diagnostic toolsTry:List all Next.js dev servers
• nextjs_callnextjs_call(port: number, toolName: string, args?: object)

  Execute a specific MCP tool on a running Next.js dev server.

  Try:Get errors from my Next.js app on port 3000Try:Show me the project metadataTry:Get logs from development server

Comparable tools

Installation

npx add-mcp next-devtools-mcp@latest

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

FAQ

How do I initialize the Next.js DevTools MCP server?

Call the `init` tool at the beginning of each Next.js development session to establish proper context and documentation requirements.

Which Next.js versions are supported?

The server works with all Next.js versions, but runtime diagnostics are only available for Next.js 16+ projects.

How do I access Next.js documentation through the MCP server?

Use the `nextjs_docs` tool with a two-step process: first search by keyword to find relevant documentation paths, then fetch the full content by path.

Compare next-devtools-mcp with