Skip to content

CSS prioritization differs between next dev --turbopack and next build --turbopack #86704

@GlebKodrik

Description

@GlebKodrik

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 block into the parent (page), the bug occurs.
  • Same thing with the intensive (page).
  • If I delete , the bug occurs.
  • If I move the content of directly into page, the bug also occurs.
  • Additional

If I delete a component that is not used anywhere at all (), the bug still occurs
Something very strange is happening here.

Image Image

Metadata

Metadata

Assignees

No one assigned

    Labels

    CSSRelated to CSS.

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions