Next.js DevTools MCP

官方

连接编码代理与运行中的 Next.js 开发服务器

分类: 开发工具第 74 / 438
Stars: ★ 830 非常热门
传输方式: stdio（本地进程）
运行环境: Node.js 20.19+
凭据: 无需凭据
最近提交: 40 天前
工具数: 4

63FMRS · C

这是 Vercel 官方维护的 Next.js DevTools MCP 服务器（MIT 许可，0.4.0 版本）。作为轻量连接器，它自动发现 Next.js 16+ 开发服务器并代理其内置 /_next/mcp 端点，让编码代理获取实时错误、路由与日志，同时通过网关工具指向版本准确文档与 agent-browser CLI。适合使用 Next.js 16+ 且依赖 MCP 编码代理的开发者；不适合非 Next.js 或低于 16 的项目，也不适合期望服务器直接抓取文档或驱动浏览器的用户。需注意默认开启的匿名遥测与 60 秒上游请求超时。

最强项 · 安装易用性 15/20 最弱项 · 可靠性 10/20

可靠性

10/20

安全与权限

12/20

维护活跃度

12/20

文档质量

14/20

安装易用性

15/20

查看各项评分依据

可靠性 10/20: 服务器声明为薄连接器，通过 stdio 传输，工具列表（nextjs_index/nextjs_call/nextjs_docs/browser_eval）与行为描述基本自洽，README 提供了故障排查（ERR_MODULE_NOT_FOUND、No server info found）与超时/取消行为说明，happy path 可信。但静态审查中仅见 README 与 server.json，没有任何已提交的测试文件或 CI 工作流作为可验证执行证据，无法确认握手、工具清单与上游 60 秒超时/中止路径真的可复现；依赖运行中的 Next.js 16+ dev server，错误路径与边界情况（端口发现失败、上游协议探测失败）缺少可核查证据。按校准规则无执行证据时不得高于 12，且测试与错误处理证据薄弱，故扣分至 10。
安全与权限 12/20: 安全性上未见红线：无凭证收集，env 变量列表为空，stdio 本地传输，不暴露公网端口；文档明确披露遥测仅采集工具名称、匿名错误与基础环境，不采集代码、文件路径、凭证或工具参数，并提供 NEXT_TELEMETRY_DISABLED=1 退出开关与本地数据删除方式，属于较清晰的默认数据流披露。但存在扣分点：遥测为默认开启（opt-out）而非显式确认（opt-in），与最小权限原则有张力；nextjs_call/browser_eval 会向上游 dev server 与浏览器自动化 CLI 发起外部网络与潜在副作用操作，README 未描述任何危险操作的确认提示；browser_eval 建议全局 npm 安装与运行第三方 CLI，属未经确认的远程代码路径；“License: unknown”在元数据中与 README 的 MIT 声明矛盾，许可边界不清会削弱权限与合规判断。综合未达红线但权限与确认说明不完整，评 12。
维护活跃度 12/20: 仓库未归档，约 819 stars、10 个未关闭 issue，版本号 0.4.0 且 README 详述 0.3.x→0.4.0 的能力迁移（移除 init、upgrade_nextjs_16 等工具与资源），说明有在维护且有版本管理意识，这是加分项。但静态证据有限：无可见的提交频率、发布节奏、依赖更新记录、issue 响应时效，也未提供安全响应渠道（SECURITY.md）或治理说明；元数据中 License 为 unknown，与 README 的 MIT 矛盾，许可与所有权证据不一致属于明显缺口。按“活跃但治理/版本存在缺口”的锚点给 12。
文档质量 14/20: 文档质量较好：安装方式覆盖 add-mcp 与手动 JSON 配置，并逐客户端给出 Amp、Claude Code、Codex（含 Windows 11 环境变量与启动超时）、Cursor、Gemini、Antigravity、VS Code/Copilot、Warp 的示例；四个工具各有参数与输出说明，明确标注 nextjs_docs 与 browser_eval 只是 gateway 不亲自执行；披露了 Node v20.19+ 与 Next.js 16+ 前置条件、60 秒上游超时与取消语义、遥测范围与退出方式、以及本地开发与故障排查。扣分在于：未提供显式 License 文件或 LICENSE 字段以印证 MIT；工具输出示例有限；对随机端口扫描范围、上游协议探测细节等限制披露不足；遥测数据保留期限与传输目标未指明，仍属“可用但存在隐藏假设”。评 14。
安装易用性 15/20: 安装易用性高：提供 npx add-mcp next-devtools-mcp@latest 一键安装与标准 mcpServers JSON 配置，覆盖八个主流客户端的具体命令，另有本地克隆+pnpm build 的开发路径与 Codex 本地示例；依赖仅为 Node LTS，无 API key、无 OAuth，连接后即可用（nextjs_index/nextjs_call 需 Next.js 16+ dev server，文档已明示）。扣分在于：使用 @latest 浮动版本，锁定与可复现性依赖客户端缓存，且已见 ERR_MODULE_NOT_FOUND 的 npx 缓存问题需要额外排障；Windows 下 Codex 需手工添加环境变量与超时；缺少版本固定（pinned version）的推荐配置；未提供无 Next.js 时的降级验证步骤。按校准规则，静态文件无 CI/测试执行证据，setup 不得高于 15，故给 15。

静态评测 · 未实际运行收录于 2026-09-10

查看 FMRS 评分方法 →

选型与风险

能访问什么执行命令或代码访问网络控制浏览器

适合谁

使用 Next.js 16+ 并希望让编码代理直接读取实时开发服务器状态的前端开发者
使用 Claude Code、Cursor、Codex 等支持 MCP 的代理工作流的团队
需要版本准确文档而不是联网抓取文档的 Next.js 项目

不适合谁

未使用 Next.js 或版本低于 16 的项目（nextjs_index / nextjs_call 需要 Next.js 16+ 运行中的开发服务器）
期望该服务器自行抓取文档或直接驱动浏览器的用户（nextjs_docs 与 browser_eval 只是网关，不执行实际工作）
需要非 stdio 传输方式（如远程 HTTP）的部署场景

所需权限

本地读取项目中的 next/package.json 以定位已安装的 Next.js 版本与文档路径
通过网络访问本地开发服务器端口（如 localhost:3000）以发现并调用 /_next/mcp 端点
在 ~/.next-devtools-mcp/ 下写入本地文件（telemetry-id、telemetry-salt 与调试日志 mcp.log）
browser_eval 可能提示安装全局 CLI：npm install -g agent-browser

风险与副作用

默认收集匿名使用遥测（工具名、匿名错误信息、会话 ID、时间戳、操作系统与 Node.js 版本等基础环境信息）；不收集代码、文件内容或路径、个人数据、凭证或工具参数。可通过 export NEXT_TELEMETRY_DISABLED=1 关闭，或用 rm -rf ~/.next-devtools-mcp 删除本地遥测数据。
运行时工具调用的上游请求（包括响应体读取）有 60 秒超时限制。
nextjs_docs 在已安装版本未附带文档时会回退到 https://nextjs.org/docs，并提示代理对照已安装版本验证 API。
使用 next-devtools-mcp@latest 会让客户端始终使用最新版本，可能引入非预期变更。

安装接入

准备工作

运行环境：Node.js 20.19+

其他可选配置项（1 个）

NEXT_TELEMETRY_DISABLED 可选设为 1 可关闭匿名使用遥测；非必需，非密钥，可加入 ~/.zshrc 或 ~/.bashrc 持久化。

确认环境满足要求：Node.js v20.19 或更新的 LTS 版本，npm 或 pnpm。
使用 add-mcp 为所有编码代理安装：npx add-mcp next-devtools-mcp@latest（加 -y 跳过提示并安装到所有检测到的代理，加 -g 全局安装）。
或在 MCP 客户端手动添加配置：{"mcpServers":{"next-devtools":{"command":"npx","args":["-y","next-devtools-mcp@latest"]}}}。
各客户端也可用命令安装，例如 Claude Code：claude mcp add next-devtools npx next-devtools-mcp@latest；Cursor 可用一键安装链接或在 Settings → MCP → New MCP Server 中添加。
启动 Next.js 开发服务器：npm run dev。Next.js 16+ 默认在 http://localhost:3000/_next/mcp 启用 MCP 端点，服务器会自动发现并连接，无需额外配置。

.mcp.json

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

以 Claude Code 为例。其他客户端的配置文件位置或字段可能不同（如 VS Code 使用 servers 字段），可用下方配置生成器转换。

.vscode/mcp.json

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

写入项目的 .vscode/mcp.json（VS Code 使用 servers 字段）。

Terminal

claude mcp add next-devtools -- npx -y next-devtools-mcp@latest

在终端运行；先把 <…> 占位符换成你自己的值。

生成并校验客户端配置

验证是否装好

在客户端工具列表中确认出现 nextjs_index、nextjs_call、nextjs_docs、browser_eval 四个工具；先运行 npm run dev 启动 Next.js 16+ 开发服务器，再让 agent 调用 nextjs_index，如能返回发现的服务器端口和 URL 即连接成功。

常见排障

出现 ERR_MODULE_NOT_FOUND 并引用 next-devtools-mcp/dist：清除 npx 缓存并重启 MCP 客户端，服务器会重新安装。
出现 [error] No server info found：nextjs_index / nextjs_call 需要运行中的 Next.js 16+ 开发服务器，请运行 npm run dev、确认版本为 16+（/_next/mcp 端点仅在该版本存在）并确认启动无错误。
browser_eval 与 nextjs_docs 无需开发服务器即可使用。
Windows 11 上使用 Codex 时，可在 .codex/config.toml 中添加环境变量（SystemRoot、PROGRAMFILES）和更长的启动超时（startup_timeout_ms = 20_000）。
本地开发时需先 pnpm install 与 pnpm build，然后将 MCP 客户端指向本地构建的 dist/index.js。

试试这样问

连接成功后，可以直接对 AI 助手这样说：

Next Devtools，我的 Next.js 应用里现在有哪些错误？
帮我展示一下当前路由的结构
开发服务器日志里有什么内容？
查一下我这个项目安装版本对应的 Next.js 文档中 Server Actions 的用法

工具能力 4

nextjs_index 只读

发现运行中的 Next.js 开发服务器，并列出各服务器的运行时 MCP 工具。

nextjs_call 只读

在已发现的服务器上调用运行时工具（错误、路由、日志、Server Actions）。

nextjs_docs 只读

网关工具。将代理指向 node_modules/next/dist/docs/ 中版本准确的文档。

browser_eval 只读

网关工具。将代理指向 agent-browser CLI 以进行浏览器自动化。

使用场景

向代理询问正在运行的 Next.js 应用中的错误（nextjs_index + nextjs_call 调用 get_errors）

查看路由与页面结构（get_page_metadata）

读取开发服务器日志（get_logs）

解析 Server Action ID 对应的源文件（get_server_action_by_id）

获取与已安装版本一致的 Next.js 文档路径（nextjs_docs）

设置 agent-browser 进行浏览器自动化（browser_eval）

支持客户端

Claude Code

Cursor

Codex

Amp

Gemini

Antigravity

VS Code

Warp

依据项目文档列出，未经本站实测。

详细介绍

next-devtools-mcp 是 Vercel 维护的 Model Context Protocol (MCP) 服务器，将 Claude、Cursor 等编码代理连接到你正在运行的 Next.js 开发服务器。它是一个轻量连接器：自动发现运行中的 Next.js 16+ 开发服务器，并代理其内置的 MCP 端点 /_next/mcp，让代理获取实时运行时错误、路由和日志。它还提供两个网关工具，把代理指向它们自行运行的工具：版本准确的文档和 agent-browser CLI。0.4.0 起，文档与迁移工作流不再包含在此服务器中，Next.js 自带文档位于 node_modules/next/dist/docs/，升级与 Cache Components 工作流以 agent skills 形式分发。