[Bug]: Investigate Next.js v15 features and limitations

[valentinpalkovic]

Describe the bug

Next.js 15 is now stable.

Investigate the following topics:

• [x] Bug: https://github.com/storybookjs/storybook/issues/29582
• [x] Bug: https://github.com/storybookjs/storybook/issues/29380
• [ ] I am concerned that people would like to use the React Compiler and will therefore opt-in for babel and opt-out from Next.js’ custom SWC compiler. The experimental-nextjs-vite framework currently only supports SWC, and not babel. It wouldn’t be hard to add babel support, though.
• [ ] https://nextjs.org/blog/next-15#executing-code-after-a-response-with-unstable_after-experimental will very likely not work out of the box in Storybook.
• [ ] https://nextjs.org/blog/next-15#support-for-nextconfigts might not work out of the box in Storybook
• [ ] [Breaking] Disallow using ssr: false option with next/dynamic in Server Components - could break usage of next/dynamic in Storybook

[terrymun]

@valentinpalkovic Thanks for looking into this! I have personally been experimenting with next@15 with storybook (using webpack under the hood), and the only major issue I'm running into is the invalid paths that @storybook/nextjs tries to use when accessing server-related internals on next.js.

If this sounds familiar to you, that's because I've opened a related issue #29380 some days ago... but I've had time to fully try to debug the issue today and finally found the root cause + create a reproducible example for you to work with.

Apologies in advance if I end up hijacking/derailing the purpose of this ticket, feel free to remove this comment so the issue stays on track 👍

[valentinpalkovic]

Hi @terrymun

Thank you very much for providing this detailed information! We will take a look as soon as we are able to work on this issue.

[terrymun]

@valentinpalkovic Really appreciate your work with keeping Storybook updated with the latest release of next :) thanks for the update! If you need any further examples or need us to test something out for you, feel free to reach out.

[DrewLandgraveCbsi]

For the Next15 release. It looks like the next/dist/client/components/headers file was moved to next/headers

[tiavina-mika]

I also encountered this issue with Next.js 15 and Storybook/Next.js. I hope it gets resolved quickly.

[bmuenzenmeyer]

I tried created a minimal reproduction to start exploring this compatibility, but until official ^15.0.0 support lands, resolution errors prevent a clean install. Of course we could override, but I'm using this as a clear indicator to wait until maintainers can help.

cc https://github.com/nodejs/nodejs.org/pull/7155

npx storybook@latest init log

``` npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: my-app@0.1.0 npm ERR! Found: next@15.0.2 npm ERR! node_modules/next npm ERR! next@"15.0.2" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer next@"^13.5.0 || ^14.0.0" from @storybook/nextjs@8.4.1 npm ERR! node_modules/@storybook/nextjs npm ERR! dev @storybook/nextjs@"^8.4.1" from the root project ```

[yannbf]

Hey everyone! Next.js 15 support has landed in Storybook v8.4.3 as well as Storybook v8.5.0-alpha.4. Please give it a try and provide us feedback <3

We will do more investigations about the other topics mentioned in this issue, but you should be able to use Next.js 15 with Storybook now!

[terrymun]

@yannbf Can confirm this is working great for us :)

[zigang93]

does next.config.ts work out of box? if no, what's workaround

[dmitrc]

does next.config.ts work out of box? if no, what's workaround

In .storybook/main.ts:

framework: {
    name: "@storybook/nextjs",
    options: {
      nextConfigPath: path.resolve(__dirname, "../next.config.ts"),
    },
  },