next-upgrade

Upgrade Next.js dependencies using official migration guides and codemods.

Updated Oct 2, 2024
One-click install
npx skills add https://github.com/James-Gamboa/portfolio-james --skill next-upgrade-james-gamboa
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: next-upgrade
Source: https://github.com/James-Gamboa/portfolio-james/tree/main/.agents/skills/next-upgrade
Command: npx skills add https://github.com/James-Gamboa/portfolio-james --skill next-upgrade-james-gamboa

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Upgrading Next.js to the latest version can be error-prone due to breaking changes, API shifts, and manual migration tasks; this Skill provides a structured, codemod-guided path to minimize downtime.

Core Features & Use Cases

  • Guided upgrade path: Determines the required steps based on the current Next.js version and performs incremental upgrades when necessary.
  • Codemod automation: Applies official Next.js codemods to automate breaking changes and API migrations.
  • Validation & testing: Updates dependencies, runs build and dev servers, and verifies essential functionality post-upgrade.

Quick Start

Upgrade Next.js to the latest version by following the migration guides and codemods.

Frequently Asked Questions about next-upgrade

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I upgrade Next.js to the latest version without breaking my application?

This skill upgrades Next.js by reading your current version from package.json and applying official codemods to automate API migrations. It updates next, react, and react-dom dependencies, then runs build and dev servers to verify functionality.

What are codemods and how do they help with Next.js migration?

Codemods are automated code transformations that apply official Next.js migration guides to your codebase. They handle breaking changes and API shifts automatically, minimizing manual migration tasks and downtime during the version upgrade.

Can I use this approach to upgrade both React and Next.js together?

Yes, the upgrade process updates next, react, and react-dom to their latest versions simultaneously. It adjusts TypeScript types if applicable and runs build and dev servers afterward to verify that the upgraded dependencies function correctly.

What's the best way to handle incremental Next.js upgrades across multiple major versions?

The best way is following an incremental upgrade path determined by your current Next.js version. This skill maps out the required steps based on official migration guides and applies automated codemod transforms as needed for each version jump.

Why does my Next.js build fail after upgrading to the latest version?

Next.js builds often fail after upgrading due to breaking changes and API shifts. This skill addresses that by applying official codemods for automated migrations and running the build server post-upgrade to verify that essential functionality works correctly.

Do I need to manually update package.json dependencies before upgrading Next.js?

No, you do not need to manually update dependencies first. The skill identifies the current Next.js version and related dependencies from package.json automatically, then upgrades next, react, and react-dom to the latest versions as part of the process.