vercel/next-devtools-mcp
БесплатноНе проверенOfficial Next.js MCP server for coding agents. Provides runtime diagnostics, route inspection, dev server logs, docs search, and upgrade guides. Requires Next.j
Описание
Official Next.js MCP server for coding agents. Provides runtime diagnostics, route inspection, dev server logs, docs search, and upgrade guides. Requires Next.js 16+ dev server for full runtime features.
README
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.
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 CLI.
[!NOTE] 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.
Requirements
- Node.js v20.19 or a newer LTS version
- npm or pnpm
- Next.js 16+ with a running dev server (for
nextjs_index/nextjs_call)
Install
Install for all your coding agents with add-mcp:
npx add-mcp next-devtools-mcp@latest
Add -y to skip the prompt and install to all detected agents. Add -g to install globally across all projects.
Or add the config to your MCP client manually:
{
"mcpServers": {
"next-devtools": {
"command": "npx",
"args": ["-y", "next-devtools-mcp@latest"]
}
}
}
[!NOTE]
next-devtools-mcp@latestkeeps your client on the latest version.
Client-specific setup
Amp
amp mcp add next-devtools -- npx next-devtools-mcp@latest
Or follow Amp's MCP docs with the config above.
Claude Code
claude mcp add next-devtools npx next-devtools-mcp@latest
Or edit your MCP settings file with the config above.
Codex
codex mcp add next-devtools -- npx next-devtools-mcp@latest
Windows 11: add environment variables and a longer startup timeout to .codex/config.toml:
env = { SystemRoot="C:\\Windows", PROGRAMFILES="C:\\Program Files" }
startup_timeout_ms = 20_000
Gemini
# Project
gemini mcp add next-devtools npx next-devtools-mcp@latest
# Global
gemini mcp add -s user next-devtools npx next-devtools-mcp@latest
Google Antigravity
Add to .gemini/antigravity/mcp_config.json:
{
"mcpServers": {
"next-devtools": {
"command": "npx",
"args": ["-y", "next-devtools-mcp@latest"]
}
}
}
See the Antigravity MCP docs.
VS Code / Copilot
code --add-mcp '{"name":"next-devtools","command":"npx","args":["-y","next-devtools-mcp@latest"]}'
Or follow the official VS Code MCP setup guide.
Warp
Settings | AI | Manage MCP Servers → + Add:
- Name:
next-devtools - Command:
npx - Arguments:
-y, next-devtools-mcp@latest
Quick Start
Start your Next.js dev server:
npm run dev
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.
Then ask your agent about the running app:
Next Devtools, what errors are in my Next.js application?
Next Devtools, show me the structure of my routes
Next Devtools, what's in the development server logs?
The agent calls nextjs_index to discover servers, then nextjs_call to query their real state.
Tools
| Tool | What it does |
|---|---|
nextjs_index |
Discover running Next.js dev servers and list each one's runtime MCP tools. |
nextjs_call |
Call a runtime tool on a discovered server (errors, routes, logs, Server Actions). |
nextjs_docs |
Gateway. Point the agent at version-accurate docs in node_modules/next/dist/docs/. |
browser_eval |
Gateway. Point the agent at the agent-browser CLI for browser automation. |
The gateways do not do the work themselves — they tell the agent where the docs are or how to install/run the CLI, and the agent runs it directly (faster than proxying through MCP).
nextjs_index — discover servers
Scans common ports for running Next.js 16+ dev servers and lists each server's built-in runtime tools at /_next/mcp. No parameters.
Runtime tools exposed by Next.js (varies by version):
get_errors— current build, runtime, and type errorsget_logs— path to the dev log file (browser console + server output)get_page_metadata— routes, pages, component metadataget_project_metadata— project structure, config, dev server URLget_server_action_by_id— resolve a Server Action ID to its source file
Output: JSON listing discovered servers (port, PID, URL) and their tools.
nextjs_call — run a runtime tool
Calls one runtime tool on a discovered server. Run nextjs_index first to find the port and tool name.
Input:
port(required) — dev server porttoolName(required) — runtime tool to invokeargs(optional) — arguments object, only if the tool requires them
{ "port": 3000, "toolName": "get_errors" }
Output: JSON with the tool's result.
nextjs_docs — find version-accurate docs
Does not fetch docs. Next.js 16+ ships its full docs (markdown, matching your installed version) at node_modules/next/dist/docs/. This tool returns that path and how to read it, so the agent uses version-accurate docs instead of training-data guesses. On older Next.js, it recommends npx @next/codemod@latest upgrade latest.
Input: topic (optional), project_path (optional, defaults to cwd).
browser_eval — set up browser automation
Does not drive the browser. It detects whether agent-browser is installed and returns either the entry point (agent-browser skills get core --full) or the install steps (npm install -g agent-browser, then agent-browser install), so the agent runs the CLI directly.
Input: task (optional) — used only to tailor the guidance.
Migrating from 0.3.x
Starting in 0.4.0, next-devtools-mcp is a thin connector.
Changed:
nextjs_docsno longer fetches docs over the network. It points the agent at the docs Next.js bundles atnode_modules/next/dist/docs/(or recommends upgrading). Thenextjs-docs://llms-indexresource is removed.
Removed:
inittool — it only enforced the old docs-fetch workflow.upgrade_nextjs_16andenable_cache_componentstools and their prompts — now distributed as agent skills.- All
cache-components://,nextjs16://, andnextjs-fundamentals://resources — superseded by the bundled docs.
What remains: nextjs_index, nextjs_call, nextjs_docs, and browser_eval.
Privacy & Telemetry
next-devtools-mcp collects anonymous usage telemetry to improve the tool:
- Tool usage — which MCP tools are invoked (e.g.
nextjs_index,nextjs_call) - Error events — anonymous error messages when tools fail
- Session metadata — session ID, timestamps, basic environment (OS, Node.js version)
Not collected: your code, file contents or paths, personal data, credentials, or tool arguments (only tool names).
Local files live under ~/.next-devtools-mcp/ (anonymous telemetry-id, telemetry-salt, and a debug log mcp.log).
Opt out by setting the environment variable (add it to ~/.zshrc / ~/.bashrc to persist):
export NEXT_TELEMETRY_DISABLED=1
Delete local telemetry data anytime:
rm -rf ~/.next-devtools-mcp
Troubleshooting
ERR_MODULE_NOT_FOUND referencing next-devtools-mcp/dist — clear your npx cache and restart your MCP client. The server reinstalls fresh.
[error] No server info found — nextjs_index / nextjs_call need a running Next.js 16+ dev server:
- Start it:
npm run dev - Confirm Next.js 16+ (the
/_next/mcpendpoint only exists there) - Verify it started without errors
browser_eval and nextjs_docs work without a dev server.
Local Development
git clone https://github.com/vercel/next-devtools-mcp.git
cd next-devtools-mcp
pnpm install
pnpm build
Point your MCP client at the local build:
{
"mcpServers": {
"next-devtools": {
"command": "node",
"args": ["/absolute/path/to/next-devtools-mcp/dist/index.js"]
}
}
}
Or with Codex:
codex mcp add next-devtools-local -- node dist/index.js
See the Next.js MCP documentation for how MCP works with Next.js and coding agents.
License
MIT
Установка vercel/next-devtools-mcp
У этого сервера нет опубликованного пакета — он собирается из исходников. Открой репозиторий и следуй инструкции в README.
▸ github.com/vercel/next-devtools-mcpFAQ
vercel/next-devtools-mcp MCP бесплатный?
Да, vercel/next-devtools-mcp MCP бесплатный — установка в пару кликов через Unyly без оплаты.
Нужен ли API-ключ для vercel/next-devtools-mcp?
Нет, vercel/next-devtools-mcp работает без API-ключей и переменных окружения.
vercel/next-devtools-mcp — hosted или self-hosted?
Self-hosted: сервер запускается локально на твоей машине командой из раздела установки.
Как установить vercel/next-devtools-mcp в Claude Desktop, Claude Code или Cursor?
Открой vercel/next-devtools-mcp на unyly.org, выбери вкладку своего клиента (Claude Desktop, Claude Code, Cursor) и нажми Install — конфиг сгенерируется автоматически, без правки JSON.
Похожие MCP
Notion
Read and write pages in your workspace
автор: NotionLinear
Issues, cycles, triage — from Claude
автор: LinearGoogle Drive
Search and read your Drive files
автор: Googlemindsdb/mindsdb
Connect and unify data across various platforms and databases with [MindsDB as a single MCP server](https://docs.mindsdb.com/mcp/overview).
автор: mindsdbCompare vercel/next-devtools-mcp with
Не уверен что выбрать?
Найди свой стек за 60 секунд
Автор?
Embed-бейдж для README
Похожее
Все в категории productivity
