next-devtools-mcp

Name: next-devtools-mcp
Author: vercel

byvercel· 1 MCP server

Stars

795

Forks

How to install next-devtools-mcp?

vercel/next-devtools-mcp

$git clone https://github.com/vercel/next-devtools-mcp

Installs into the current project.

›Prefer a prompt? Paste this to your agent

Install & use

Install next-devtools-mcp by running `git clone https://github.com/vercel/next-devtools-mcp`, then use it for the current task and follow its documentation at https://github.com/vercel/next-devtools-mcp.

Files · 1

View on GitHub

README.md

1	# Next.js DevTools MCP
2
3	[![npm next-devtools-mcp package](https://img.shields.io/npm/v/next-devtools-mcp.svg)](https://npmjs.org/package/next-devtools-mcp)
4
5	`next-devtools-mcp` is a Model Context Protocol (MCP) server that connects coding agents like Claude and Cursor to your running Next.js dev server.
6
7	It is a thin connector. It discovers running Next.js 16+ dev servers and proxies their built-in MCP endpoint (`/_next/mcp`) so agents get live runtime errors, routes, and logs. It also ships two gateways that point agents at tools they run directly: version-accurate docs and the [`agent-browser`](https://github.com/vercel-labs/agent-browser) CLI.
8
9	> [!NOTE]
10	> Docs and migration workflows no longer live in this server. Next.js bundles its own docs at `node_modules/next/dist/docs/`, and upgrade / Cache Components workflows are distributed as agent skills. See [Migrating from 0.3.x](#migrating-from-03x).
11
12	## Requirements
13
14	- [Node.js](https://nodejs.org/) v20.19 or a newer [LTS](https://github.com/nodejs/Release#release-schedule) version
15	- [npm](https://www.npmjs.com/) or [pnpm](https://pnpm.io/)
16	- Next.js 16+ with a running dev server (for `nextjs_index` / `nextjs_call`)
17
18	## Install
19
20	Install for all your coding agents with [`add-mcp`](https://www.npmjs.com/package/add-mcp):
21
22	```bash
23	npx add-mcp next-devtools-mcp@latest
24	```
25
26	Add `-y` to skip the prompt and install to all detected agents. Add `-g` to install globally across all projects.
27
28	Or add the config to your MCP client manually:
29
30	```json
31	{
32	"mcpServers": {
33	"next-devtools": {
34	"command": "npx",
35	"args": ["-y", "next-devtools-mcp@latest"]
36	}
37	}
38	}
39	```
40
41	> [!NOTE]
42	> `next-devtools-mcp@latest` keeps your client on the latest version.
43
44	### Client-specific setup
45
46	<details>
47	<summary>Amp</summary>
48
49	```bash
50	amp mcp add next-devtools -- npx next-devtools-mcp@latest
51	```
52
53	Or follow [Amp's MCP docs](https://ampcode.com/manual#mcp) with the config above.
54
55	</details>
56
57	<details>
58	<summary>Claude Code</summary>
59
60	```bash
61	claude mcp add next-devtools npx next-devtools-mcp@latest
62	```
63
64	Or edit your MCP settings file with the config above.
65
66	</details>
67
68	<details>
69	<summary>Codex</summary>
70
71	```bash
72	codex mcp add next-devtools -- npx next-devtools-mcp@latest
73	```
74
75	Windows 11: add environment variables and a longer startup timeout to `.codex/config.toml`:
76
77	```toml
78	env = { SystemRoot="C:\\Windows", PROGRAMFILES="C:\\Program Files" }
79	startup_timeout_ms = 20_000
80	```
81
82	</details>
83
84	<details>
85	<summary>Cursor</summary>
86
87	[Install in Cursor](https://cursor.com/en/install-mcp?name=next-devtools&config=eyJjb21tYW5kIjoibnB4IC15IG5leHQtZGV2dG9vbHMtbWNwQGxhdGVzdCJ9)
88
89	Or go to `Cursor Settings` → `MCP` → `New MCP Server` and use the config above.
90
91	</details>
92
93	<details>
94	<summary>Gemini</summary>
95
96	```bash
97	# Project
98	gemini mcp add next-devtools npx next-devtools-mcp@latest
99
100	# Global
101	gemini mcp add -s user next-devtools npx next-devtools-mcp@latest
102	```
103
104	</details>
105
106	<details>
107	<summary>Google Antigravity</summary>
108
109	Add to `.gemini/antigravity/mcp_config.json`:
110
111	```json
112	{
113	"mcpServers": {
114	"next-devtools": {
115	"command": "npx",
116	"args": ["-y", "next-devtools-mcp@latest"]
117	}
118	}
119	}
120	```
121
122	See the [Antigravity MCP docs](https://antigravity.google/docs/mcp).
123
124	</details>
125
126	<details>
127	<summary>VS Code / Copilot</summary>
128
129	```bash
130	code --add-mcp '{"name":"next-devtools","command":"npx","args":["-y","next-devtools-mcp@latest"]}'
131	```
132
133	Or follow the official VS Code MCP setup guide.
134
135	</details>
136
137	<details>
138	<summary>Warp</summary>
139
140	`Settings \| AI \| Manage MCP Servers` → `+ Add`:
141	- Name: `next-devtools`
142	- Command: `npx`
143	- Arguments: `-y, next-devtools-mcp@latest`
144
145	</details>
146
147	## Quick Start
148
149	Start your Next.js dev server:
150
151	```bash
152	npm run dev
153	```
154
155	Next.js 16+ enables its MCP endpoint by default at `http://localhost:3000/_next/mcp`. `next-devtools-mcp` discovers and connects to it automatically — no config needed.
156
157	Then ask your agent about the running app:
158
159	```
160	Next Devtools, what errors are in my N

6 picks

Type

Install next-devtools-mcp by running `git clone https://github.com/vercel/next-devtools-mcp`, then use it for the current task and follow its documentation at https://github.com/vercel/next-devtools-mcp.

next-devtools-mcp

How to install next-devtools-mcp?

Related

next-devtools-mcp

How to install next-devtools-mcp?

Related