vercel
CSS prioritization differs between next dev --turbopack and next build --turbopack
Link to the code that reproduces this issue
https://github.com/GlebKodrik/turbopack-style/
To Reproduce
Run the app in development with next dev --turbopack → Styles load correctly, no issues observed.
Build the app with next build --turbopack and then start with next start → Styles are applied in a different priority/order compared to dev mode.
The issue reproduces 100% on our current setup. Sometimes deleting the pages folder or a random component in entities makes the bug disappear, which makes the behavior unpredictable.
Current vs. Expected behavior
Current: In production (next build --turbopack + next start), CSS order/priority differs from development, breaking the layout. Expected: Style prioritization should be consistent between dev and build modes when using Turbopack.
Provide environment information
Operating System:
Platform: darwin
Arch: arm64
Version: Darwin Kernel Version 23.6.0
Binaries:
Node: 20.9.0
npm: 10.8.2
Relevant Packages:
next: 15.6.0-canary.12
Next.js Config:
output: N/A
Which area(s) are affected? (Select all that apply)
CSS
Which stage(s) are affected? (Select all that apply)
next dev (local), next build (local)
Additional context
Additional context Happens locally with next build --turbopack → next start. Cannot reproduce when running next dev --turbopack. Issue sometimes disappears after removing a random folder/component, which suggests non-deterministic style bundling.
1 image - next dev --turbopack 2 image next build --turbopack → next start
I’ve minimized the code a lot, so now it’s much easier to understand what’s going on. Please pay special attention to the page.
Reproduction link: http://localhost:3000/intensive
We are working with (pages).
- If I delete the course page, the bug occurs.
- If I move the <CourseProgramStudy /> block into the parent (page), the bug occurs.
- Same thing with the intensive (page).
- If I delete <WhoItSuitableFor />, the bug occurs.
- If I move the content of <WhoItSuitableFor /> directly into page, the bug also occurs.
- Additional
If I delete a component that is not used anywhere at all (<CourseProgramLessonCard />), the bug still occurs Something very strange is happening here.
