Next.js Version Upgrade Dependency Changes

Next.js Upgrade Dependency Tracking

Next.js upgrades often require coordinated updates across multiple packages. The Package.json Diff tool shows you every change needed for a successful upgrade.

Typical Next.js 14 to 15 diff

dependencies:
  ~ next: ^14.0.0 -> ^15.0.0               [MAJOR]
  ~ react: ^18.2.0 -> ^19.0.0              [MAJOR]
  ~ react-dom: ^18.2.0 -> ^19.0.0          [MAJOR]

devDependencies:
  ~ @types/react: ^18.2.0 -> ^19.0.0       [MAJOR]
  ~ @types/react-dom: ^18.2.0 -> ^19.0.0   [MAJOR]
  ~ eslint-config-next: ^14.0.0 -> ^15.0.0 [MAJOR]
  + @next/codemod: ^15.0.0                  [ADDED]

scripts:
  ~ dev: "next dev" -> "next dev --turbo"   [CHANGED]

Packages to check for each Next.js upgrade

Package	Why
next	Core framework
react / react-dom	Peer dependency of Next.js
@types/react	Must match React version
eslint-config-next	Linting rules for Next.js
@next/font	May be deprecated in favor of built-in
@next/image	May have API changes

Migration steps

1. Create a snapshot of your current package.json
2. Run the Next.js upgrade command: npx @next/codemod@latest upgrade
3. Compare the result using this diff tool
4. Verify all MAJOR bumps have corresponding changelog entries
5. Check scripts for new flags or changed commands
6. Run the full test suite after updating

Common pitfalls

• Forgetting to update eslint-config-next causes linting errors
• Mismatched React and @types/react versions cause type errors
• Old next/font imports may need to be updated to next/font/google
• App Router vs Pages Router may have different migration requirements