Nextjs: Fix Nextjs version detection with prereleases

[yannbf]

Closes #

What I did

Fixed version detection, which before didn't account for prereleases (e.g. 16.0.0-canary.4)

Checklist for Contributors

Testing

The changes in this PR are covered in the following automated tests:

• stories
• unit tests
• integration tests
• end-to-end tests

Manual testing

This section is mandatory for all contributions. If you believe no manual test is necessary, please state so explicitly. Thanks!

Documentation

• Add or update documentation reflecting your changes
• If you are deprecating/removing a feature, make sure to update
  MIGRATION.MD

Checklist for Maintainers

• When this PR is ready for testing, make sure to add ci:normal, ci:merged or ci:daily GH label to it to run a specific set of sandboxes. The particular set of sandboxes can be found in code/lib/cli-storybook/src/sandbox-templates.ts

• Make sure this PR contains one of the labels below:

  Available labels

  • bug: Internal changes that fixes incorrect behavior.
  • maintenance: User-facing maintenance tasks.
  • dependencies: Upgrading (sometimes downgrading) dependencies.
  • build: Internal-facing build tooling & test updates. Will not show up in release changelog.
  • cleanup: Minor cleanup style change. Will not show up in release changelog.
  • documentation: Documentation only changes. Will not show up in release changelog.
  • feature request: Introducing a new feature.
  • BREAKING CHANGE: Changes that break compatibility in some way with current major version.
  • other: Changes that don't fit in the above categories.

🦋 Canary release

This pull request has been released as version 0.0.0-pr-32724-sha-ec66cb67. Try it out in a new sandbox by running npx [email protected] sandbox or in an existing project with npx [email protected] upgrade.

More information

Published version	0.0.0-pr-32724-sha-ec66cb67
Triggered by	@yannbf
Repository	storybookjs/storybook
Branch	yann/fix-nextjs-v16-detection
Commit	ec66cb67
Datetime	Tue Oct 14 11:00:34 UTC 2025 (1760439634)
Workflow run	18494303004

To request a new release of this pull request, mention the @storybookjs/core team.

core team members can create a new canary release here or locally with gh workflow run --repo storybookjs/storybook publish.yml --field pr=32724

Summary by CodeRabbit

• New Features

  • No user-visible features added.

• Refactor

  • Streamlined Next.js version detection used in build and preset configuration, replacing manual checks with a centralized approach.
  • Ensures consistent behavior when gating features for Next.js v16 and newer, while preserving existing runtime configuration paths.
  • No changes to app behavior or configuration; future compatibility improved.
  • No action required.

[coderabbitai]

📝 Walkthrough

Walkthrough

Refactors Next.js version detection to use a new utility, isNextVersionGte, replacing direct semver checks in webpack and preset modules. Adds the helper in utils.ts. No changes to public APIs or overall control flow beyond substituting the version check mechanism.

Changes

Cohort / File(s)	Summary
Version check refactor (framework/Next.js) code/frameworks/nextjs/src/config/webpack.ts, code/frameworks/nextjs/src/preset.ts	Replace semver-based Next.js version checks using getNextjsVersion with isNextVersionGte('16.0.0'); adjust imports accordingly. Control flow and runtime config handling remain unchanged.
Utilities update code/frameworks/nextjs/src/utils.ts	Add exported function isNextVersionGte(version: string): boolean using getNextjsVersion and semver.coerce to compare versions; import semver. No other changes.

Sequence Diagram(s)

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

• Next.js: Remove next/config usage in Next.js >=v16 projects #32547 — Adjusts Next.js framework integration logic around version detection and next/config handling, closely aligning with this PR’s shift to centralized version comparison.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch yann/fix-nextjs-v16-detection

---

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between a78bf07 and ec66cb6.

📒 Files selected for processing (3)

• code/frameworks/nextjs/src/config/webpack.ts (1 hunks)
• code/frameworks/nextjs/src/preset.ts (2 hunks)
• code/frameworks/nextjs/src/utils.ts (2 hunks)

🧰 Additional context used

📓 Path-based instructions (4)

**/*.{js,jsx,json,html,ts,tsx,mjs}

📄 CodeRabbit inference engine (.github/copilot-instructions.md)

**/*.{js,jsx,json,html,ts,tsx,mjs}: Run Prettier formatting on changed files before committing
Run ESLint on changed files and fix all errors/warnings before committing (use yarn lint:js:cmd <file>)

Files:

• code/frameworks/nextjs/src/utils.ts
• code/frameworks/nextjs/src/preset.ts
• code/frameworks/nextjs/src/config/webpack.ts

**/*.{ts,tsx,js,jsx,mjs}

📄 CodeRabbit inference engine (.github/copilot-instructions.md)

Export functions from modules when they need to be unit-tested

Files:

• code/frameworks/nextjs/src/utils.ts
• code/frameworks/nextjs/src/preset.ts
• code/frameworks/nextjs/src/config/webpack.ts

code/**/*.{ts,tsx,js,jsx,mjs}

📄 CodeRabbit inference engine (.github/copilot-instructions.md)

In application code, use Storybook loggers instead of console.* (client code: storybook/internal/client-logger; server code: storybook/internal/node-logger)

Files:

• code/frameworks/nextjs/src/utils.ts
• code/frameworks/nextjs/src/preset.ts
• code/frameworks/nextjs/src/config/webpack.ts

{code/**,scripts/**}/**/*.{ts,tsx,js,jsx,mjs}

📄 CodeRabbit inference engine (.github/copilot-instructions.md)

Do not use console.log, console.warn, or console.error directly unless in isolated files where importing loggers would significantly increase bundle size

Files:

• code/frameworks/nextjs/src/utils.ts
• code/frameworks/nextjs/src/preset.ts
• code/frameworks/nextjs/src/config/webpack.ts

🔇 Additional comments (3)

code/frameworks/nextjs/src/utils.ts (1)

28-32: LGTM! Consider adding unit tests.

The implementation correctly uses semver.coerce() to handle prerelease versions (e.g., "16.0.0-canary.4" → "16.0.0"), which addresses the PR objective. The fallback to false when coercion fails is a safe default.

Per coding guidelines, exported functions that need unit testing should be tested. Please ensure this function has test coverage for:

• Standard versions (e.g., "15.0.0", "16.0.0")
• Prerelease versions (e.g., "16.0.0-canary.4", "16.0.0-rc.1")
• Edge cases where coercion might fail (malformed versions)

Do you want me to generate a test suite for this function?

code/frameworks/nextjs/src/preset.ts (1)

54-54: LGTM! Good consolidation of version checking logic.

The refactor to use isNextVersionGte improves consistency and ensures prerelease versions are handled correctly throughout the codebase.

code/frameworks/nextjs/src/config/webpack.ts (1)

8-8: LGTM! Note the module-level evaluation.

The refactor correctly uses the new isNextVersionGte helper to handle prerelease versions. The module-level constant evaluation is appropriate here since the Next.js version is static for the lifetime of the application.

Warning

Review ran into problems

🔥 Problems

Git: Failed to clone repository. Please run the @coderabbitai full review command to re-trigger a full review. If the issue persists, set path_filters to include or exclude specific files.

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[nx-cloud]

View your CI Pipeline Execution ↗ for commit ec66cb6

Command	Status	Duration	Result
nx run-many -t build --parallel=3	✅ Succeeded	46s	View ↗

---

☁️ Nx Cloud last updated this comment at 2025-10-14 11:07:39 UTC