Next.js-vite: Fix module resolution in preset with fileURLToPath

[ndelangen]

Closes #32378

What I did

The reference to the previewAnnotation was not wrapped with fileURLToPath which is needed for vite in some situations

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

I have manually verified this fix solves the problem by copying over the dist into a failing reproduction.
Afterwards the sandbox worked.

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-32386-sha-09a230ff. Try it out in a new sandbox by running npx storybook@0.0.0-pr-32386-sha-09a230ff sandbox or in an existing project with npx storybook@0.0.0-pr-32386-sha-09a230ff upgrade.

More information

Published version	0.0.0-pr-32386-sha-09a230ff
Triggered by	@shilman
Repository	storybookjs/storybook
Branch	norbert/esm-nextjs-vite-resolve-fix
Commit	09a230ff
Datetime	Wed Sep 3 14:08:29 UTC 2025 (1756908509)
Workflow run	17436120265

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 canary-release-pr.yml --field pr=32386

Greptile Summary

Updated On: 2025-09-03 13:02:04 UTC

This PR fixes a critical ESM module resolution bug in the Next.js Vite framework preset by wrapping three import.meta.resolve() calls with fileURLToPath(). The issue was causing Storybook to fail on fresh installs with Next.js Vite, producing malformed file paths that mixed absolute filesystem paths with file:// URL protocols.

The problem occurs because import.meta.resolve() returns file URLs (starting with file://), but Vite's module resolution system expects standard filesystem paths. Without proper conversion, the resulting paths were malformed, causing import resolution failures during development.

The fix applies fileURLToPath() to three key module references:

• The builder-vite name resolution (line 28)
• The React renderer preset (line 33)
• The Next.js Vite preview annotations (line 38)

This change aligns with Node.js ESM best practices and maintains consistency with other parts of the same file that were already correctly using fileURLToPath() for styled-jsx module resolution. The fix is targeted and minimal, addressing only the specific paths that were causing the resolution failures while preserving all existing functionality.

Confidence score: 5/5

• This PR is safe to merge with minimal risk as it fixes a clear bug without changing functionality
• Score reflects a straightforward bug fix following established patterns already present in the codebase
• No files require special attention beyond the single modified preset file

[nx-cloud]

View your CI Pipeline Execution ↗ for commit 09a230f

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

---

☁️ Nx Cloud last updated this comment at 2025-09-03 13:00:20 UTC

[greptile-apps]

_{1 file reviewed, no comments}

_{Edit Code Review Bot Settings | Greptile}

[shilman]

Thanks @ndelangen . Tested and it fixes the problem. @JReinhold can you please do a technical review? I'm merging & releasing to unblock our announcement.