next-upgrade

概览

什么是 next-upgrade？

next-upgrade 是一款专为前端开发者设计的技能，帮助你无缝升级 Next.js 项目到最新版本。通过自动应用官方迁移指南和代码转换工具，next-upgrade 大幅减少手动操作，降低重大版本升级中的出错风险。

谁适合使用 next-upgrade？

该技能适合维护生产环境应用的 React 和 Next.js 开发者，帮助他们及时获取最新功能、安全补丁和性能优化。尤其适合管理复杂代码库的团队，或需要遵循框架升级最佳实践的开发者。

next-upgrade 解决了哪些问题

• 自动检测当前 Next.js 版本及相关依赖
• 获取并应用最新官方迁移指南
• 执行推荐的代码转换工具处理破坏性变更
• 指导分步升级，支持跨大版本跳跃
• 确保 React 和 React DOM 等同级依赖同步更新

使用方法

安装步骤

1. 将技能添加到你的 agent 中：

   npx skills add https://github.com/vercel-labs/next-skills --skill next-upgrade
   

2. 准备项目：
   • 确保项目使用 Next.js 并包含 package.json 文件。
   • 在开始升级前提交或备份代码。

运行 next-upgrade

1. 查看技能文档：
   • 打开 SKILL.md，了解详细介绍和参数提示。
2. 检测当前版本：
   • 技能会读取你的 package.json，识别当前 Next.js 及相关依赖版本。
3. 获取并审查迁移指南：
   • next-upgrade 会从 nextjs.org 获取最新官方升级文档，包括代码转换工具和版本特定指南。
4. 应用代码转换工具：
   • 使用推荐的代码转换工具完成升级。例如：

     npx @next/codemod@latest <transform> <path>
     

   • 常用转换包括 next-async-request-api、next-request-geo-ip 和 next-dynamic-access-named-export。
5. 更新依赖：
   • 同步升级 Next.js 及其同级依赖：

     npm install next@latest react@latest react-dom@latest
     

6. 审查并测试：
   • 按迁移指南完成手动步骤和处理破坏性变更。
   • 每步升级后彻底测试应用。

建议查看的文件

• SKILL.md – 主要使用指南
• README.md、AGENTS.md 和 metadata.json – 额外背景和配置说明

常见问题

next-upgrade 自动化了哪些内容？

next-upgrade 自动检测版本、获取官方迁移指南并执行代码转换工具，简化升级流程，但仍需开发者审查和测试。

next-upgrade 支持所有 Next.js 版本升级吗？

支持。next-upgrade 通过官方指南支持从旧版本逐步升级。对于跨大版本升级，建议逐个大版本依次升级。

next-upgrade 会更新 React 和 React DOM 吗？

会。该技能确保 React 和 React DOM 等同级依赖与 Next.js 同步升级，保证兼容性。

哪里可以找到更多细节或排查问题？

请在 Files 标签查看完整文件树，包括嵌套引用和辅助脚本。务必参考官方 Next.js 迁移文档，获取最新指导。