项目简介 'next-devtools-mcp' 是一个强大的开发工具服务器，专门为使用Next.js框架的开发者设计，通过与AI编码助手集成，极大提升开发效率。它能够让AI助手直接访问Next.js项目的运行时状态、文档和自动化工具，从而更智能地协助代码升级、问题诊断和新功能开发。

主要功能点

实时诊断与应用状态访问： 直接连接到运行中的Next.js开发服务器，让AI助手能够查询实时错误、日志、路由结构、组件元数据和服务器动作，帮助快速定位和解决问题。
开发自动化： 提供一系列自动化工具，包括Next.js 16的自动化升级（带codemod支持）、Cache Components模式的迁移和设置（包含错误检测与自动修复），以及通过Playwright进行浏览器自动化测试。
知识库与官方文档： 集成Next.js 16的精选知识库资源，支持直接搜索和检索Next.js官方文档，确保AI助手获取的信息始终是最新和最准确的。
预设Prompt模板： 提供用于常见开发任务的预设Prompt模板，如Next.js 16升级指南和Cache Components启用指南，简化AI助手的指令。

安装步骤 'next-devtools-mcp' 服务器通常通过'npx'命令启动，无需全局安装。在你的MCP客户端中进行配置即可使用。

服务器配置 要将此MCP服务器添加到你的MCP客户端，你需要配置其启动命令。以下是一个通用的JSON配置格式示例，请根据你的MCP客户端的具体配置方式进行调整：

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

'next-devtools': 这是你在MCP客户端中为该服务器定义的名称。
'command': 指定启动服务器的命令，这里是'npx'。
'args': 启动命令的参数列表。'-y' 表示自动确认安装，'next-devtools-mcp@latest' 表示使用最新版本的'next-devtools-mcp'包。

基本使用方法

启动Next.js开发服务器： 对于Next.js 16+项目，请在你的项目根目录运行 'npm run dev' 或 'pnpm dev'。'next-devtools-mcp' 会自动发现并连接到你的开发服务器。
初始化MCP上下文（重要！）： 在每次Next.js开发会话开始时，务必指示你的AI助手调用 'init' 工具来设置正确的上下文并确保使用官方文档。例如，你可以输入：
```
使用 init 工具设置 Next.js DevTools 上下文
```
建议将此指令添加到AI助手的全局配置中，使其在每次Next.js会话开始时自动执行。

与AI助手交互： 初始化完成后，你可以开始向AI助手提问，它将利用 'next-devtools-mcp' 提供的工具和知识库来协助你：

查询实时错误：

Next Devtools, 我的 Next.js 应用有什么错误？

查看路由结构：

Next Devtools, 给我看看我的路由结构

获取开发服务器日志：

Next Devtools, 开发服务器日志里有什么？

升级Next.js版本：

Next Devtools, 帮我把 Next.js 应用升级到版本 16

搜索Next.js文档：

Next Devtools, 搜索 Next.js 文档中关于 generateMetadata 的内容

关键词