Issue Station
Sign In
Tools hereToolbox

nextjs - 💡(How to fix) Fix CSS layers are incorrectly stripped from output [1 comments, 2 participants]

Official PRs (…)
ON THIS PAGE

Recommended Tools

×6

Utilities matched from this issue’s tags and category — try them while you read without losing context.

GitHub issue graph ai analysis

Paste a GitHub issue URL. We fetch that issue, discover linked issues from bodies/comments/timeline, collect linked pull requests, and produce a structured English report.

The report is written in English Markdown for sharing and archival.

Helpful · Quick feedback

Loading…
GitHub stats
vercel/next.js#88532•Fetched 2026-04-08 02:04:35
View on GitHub
Comments
1
Participants
2
Timeline
6
Reactions
0
Author
rossjrwrossjrw
Participants
github-actions[bot]github-actions[bot]rossjrwrossjrw
Timeline (top)
labeled ×2closed ×1commented ×1issue_type_added ×1

Code Example

npm install
npm run build
cat .next/**/*.css

---

@layer test1;
@import url("https://example.com/test1.css") layer(test1);

---

$ cat .next/**/*.css
@layer test1;@import url("https://example.com/test1.css") layer(test1);%

---

$ cat .next/**/*.css
@import "https://example.com/test1.css";
@layer test1;

---

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 25.0.0: Mon Aug 25 21:17:56 PDT 2025; root:xnu-12377.1.9~3/RELEASE_ARM64_T6030
  Available memory (MB): 18432
  Available CPU cores: 11
Binaries:
  Node: 24.10.0
  npm: 11.6.0
  Yarn: N/A
  pnpm: N/A
Relevant Packages:
  next: 16.1.1 // Latest available version is detected (16.1.1).
  eslint-config-next: N/A
  react: 19.2.3
  react-dom: 19.2.3
  typescript: N/A
Next.js Config:
  output: N/A
RAW_BUFFERClick to expand / collapse

Link to the code that reproduces this issue

https://github.com/rossjrw/turbopack-css-layer-removal-mre

To Reproduce

npm install
npm run build
cat .next/**/*.css

Current vs. Expected behavior

Given the following raw CSS input:

@layer test1;
@import url("https://example.com/test1.css") layer(test1);

I expect the NextJS build process to preserve the import layer directive in the output.

This is the case in NextJS 15:

$ cat .next/**/*.css
@layer test1;@import url("https://example.com/test1.css") layer(test1);%

But not in NextJS 16:

$ cat .next/**/*.css
@import "https://example.com/test1.css";
@layer test1;

This looks like a bug introduced by NextJS 16 that exacerbates non-deterministic CSS ordering by removing one of the tools used to control it.

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 25.0.0: Mon Aug 25 21:17:56 PDT 2025; root:xnu-12377.1.9~3/RELEASE_ARM64_T6030
  Available memory (MB): 18432
  Available CPU cores: 11
Binaries:
  Node: 24.10.0
  npm: 11.6.0
  Yarn: N/A
  pnpm: N/A
Relevant Packages:
  next: 16.1.1 // Latest available version is detected (16.1.1).
  eslint-config-next: N/A
  react: 19.2.3
  react-dom: 19.2.3
  typescript: N/A
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

Turbopack

Which stage(s) are affected? (Select all that apply)

next build (local), next dev (local), next start (local)

Additional context

Tested against canary releases:

  • without --turbopack: introduced in v15.6.0-canary.40, which made turbopack the default
  • with --turbopack: introduced in v15.3.0-canary.11, which added --turbopack (unknown option in canary.10)

extent analysis

TL;DR

The issue can be worked around by downgrading to NextJS 15 or waiting for a fix in a future version of NextJS.

Guidance

  • Verify the issue by comparing the output of cat .next/**/*.css between NextJS 15 and 16.
  • Check the NextJS changelog and issues for any mentions of this bug and potential fixes.
  • Consider opening an issue with NextJS to report this bug and request a fix.
  • If possible, test the application with the --turbopack flag disabled to see if the issue persists.

Example

No code snippet is provided as the issue is related to the behavior of NextJS and not a specific code snippet.

Notes

The issue seems to be related to the introduction of Turbopack in NextJS 15.6.0-canary.40 and 15.3.0-canary.11. The exact cause and solution are uncertain without further investigation.

Recommendation

Apply workaround: Downgrade to NextJS 15 until a fix is available in a future version, as the current version of NextJS 16 has a bug that removes the import layer directive.

Vote matrix · Quick signals

Works
Did the solution work? Tap to confirm.
Easy Fix
Was it a quick fix?
Time Saver
Did it save you time?
Blocking
Was it severely blocking?
Common Issue
Are others likely hitting this too?
Flaky / Intermittent
Is it intermittent?
Verified / Reproducible
Can you reproduce it reliably?
Loading…
#model download#tokenizer error#prompt formatting#chain error#conversation history

Still need to ship something?

×6

Another batch ranked right after the header list — different links, same matching logic.

Back to top recommendations

TRENDING

nextjs - 💡(How to fix) Fix CSS layers are incorrectly stripped from output [1 comments, 2 participants]