Next.js开发工具扩展

Next.js DevTools MCP 扩展插件，适用于 Zed

一个Zed扩展，集成了Next.js DevTools MCP服务器，为AI辅助开发提供支持。

特点/功能

• 访问 Next.js 16+ 的文档和最佳实践指南
• 自动化Next.js升级工具
• 缓存组件的设置与配置
• 使用 Playwright 进行浏览器测试集成
• 实时 Next.js 运行时诊断（需要 Next.js 16+）

安装

来自Zed扩展

1. 开放Zed
2. 新闻界（或“媒体”） Cmd+Shift+P (Mac) 或者 Ctrl+Shift+P (Linux/Windows)
3. 输入“extensions”并选择“扩展程序：安装扩展程序”
4. 搜索“Next.js DevTools MCP”
5. 点击安装

作为开发扩展（用于开发）

1. 克隆此仓库
2. 开放Zed
3. 新闻界；媒体 Cmd+Shift+P 并选择“扩展：安装开发者扩展”
4. 选择 zed-extension 目录

要求

• Node.js 版本 20.19 或更高版本
• npm 或 pnpm
• Next.js 项目（可选，但建议使用以获得完整功能）

用法

安装完成后，MCP 服务器将出现在 Zed 的代理面板中。

示例提示

Help me upgrade my Next.js app to version 16

What's the structure of my Next.js routes?

Enable Cache Components in my project

MCP服务器功能

此扩展提供了访问：

• 文档搜索查询 Next.js 文档和知识库
• 升级工具使用代码转换工具自动化升级到 Next.js 16
• 缓存组件设置完成设置并进行错误检测
• 浏览器测试用于自动化测试的 playwright 集成
• 运行时诊断实时Next.js开发服务器洞察（Next.js 16+）

发展

# Install dependencies
cargo build --release --target wasm32-wasip1

# Test in Zed
# Install as dev extension and check logs with Cmd+Shift+P -> "Zed: Open Log"

许可证

麻省理工学院（MIT）

贡献

欢迎贡献！请提出问题或提交拉取请求。

链接

• Next.js DevTools MCP（注：MCP在此处可能代表特定的模块、组件或配置，但根据上下文无法确定具体含义，因此直接保留原样）
• Zed 扩展文档
• 模型上下文协议