# Next.js DevTools MCP server

> Connects coding agents to a running Next.js dev server for live errors, routes, logs, and Server Actions.

- Repository: https://github.com/vercel/next-devtools-mcp
- Page: https://hostedmcp.org/servers/vercel/next-devtools-mcp
- Official: yes
- Transport: stdio
- Stars: 836
- Latest version: 0.3.6

## Install

### Claude Code

```sh
claude mcp add next-devtools-mcp -- npx -y next-devtools-mcp
```

### Cursor (`~/.cursor/mcp.json`)

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

### VS Code (`.vscode/mcp.json`)

```json
{
  "servers": {
    "next-devtools-mcp": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "next-devtools-mcp"
      ]
    }
  }
}
```

### VS Code CLI

```sh
code --add-mcp '{"name":"next-devtools-mcp","type":"stdio","command":"npx","args":["-y","next-devtools-mcp"]}'
```

### Claude Desktop (`claude_desktop_config.json`)

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

### Codex

```sh
codex mcp add next-devtools-mcp -- npx -y next-devtools-mcp
```

### Codex config.toml (`~/.codex/config.toml`)

```toml
[mcp_servers.next-devtools-mcp]
command = "npx"
args = ["-y", "next-devtools-mcp"]
```

### Gemini CLI

```sh
gemini mcp add -s user next-devtools-mcp npx -- -y next-devtools-mcp
```

### Gemini settings.json (`~/.gemini/settings.json`)

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

## Environment variables

| Name | Required | Secret | Description |
|---|---|---|---|
| `NEXT_TELEMETRY_DISABLED` | no | no |  |

## Tools (12)

- `nextjs_index`
- `nextjs_call`
- `nextjs_docs`
- `browser_eval`
- `get_errors`
- `get_logs`
- `get_page_metadata`
- `get_project_metadata`
- `get_server_action_by_id`
- `port`
- `toolName`
- `args`

## FAQ

### What does next-devtools-mcp do?

It discovers running Next.js 16+ dev servers and proxies their built-in MCP endpoint so agents get live runtime errors, routes, and logs.

### What are the requirements for next-devtools-mcp?

You need Node.js v20.19 or newer plus Next.js 16+ with a running dev server for the runtime tools.

### How do I install next-devtools-mcp?

Run npx add-mcp next-devtools-mcp@latest, or add it to your MCP client config using npx -y next-devtools-mcp@latest as the command.

### Which tools does next-devtools-mcp expose?

It exposes nextjs_index, nextjs_call, nextjs_docs, and browser_eval.

### Does next-devtools-mcp collect telemetry?

Yes, it collects anonymous tool-usage and error telemetry, which you can disable with NEXT_TELEMETRY_DISABLED=1.