App Router includes unused CSS module in unrelated routes (bundle analyzer + runtime)
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 142k
- Forks
- 32.5k
- Avg merge
- 2d 14h
- Merged PRs (30d)
- 351
Description
Link to the code that reproduces this issue
https://github.com/t18n/next-js-app-router-css-bundle-repro/tree/main
To Reproduce
pnpm install
2.pnpm build:analyzer- Open http://localhost:4000/ and check the analyzer output for dashboard and dashboard/users
- Note
Button.module.scssis included and loaded on those routes
Current vs. Expected behavior
-
Expected: Button.module.scss only loads on home and not-found routes where Button is used.
-
Actual: Button.module.scss is included and loaded for dashboard and dashboard/users, and blocks render.
Provide environment information
Operating System:
Platform: darwin
Arch: arm64
Version: Darwin Kernel Version 25.2.0: Tue Nov 18 21:09:40 PST 2025; root:xnu-12377.61.12~1/RELEASE_ARM64_T6000
Available memory (MB): 32768
Available CPU cores: 10
Binaries:
Node: 24.6.0
npm: 11.5.1
Yarn: 1.22.22
pnpm: 10.24.0
Relevant Packages:
next: 16.1.6 // Latest available version is detected (16.1.6).
eslint-config-next: N/A
react: 19.2.3
react-dom: 19.2.3
typescript: 5.9.3
Next.js Config:
output: N/A
Which area(s) are affected? (Select all that apply)
CSS, Turbopack
Which stage(s) are affected? (Select all that apply)
next build (local), Other (Deployed), next start (local)
Additional context
- Repro is local and also impacts production (CSS loads on unrelated routes and blocks render).
- On a larger project with 100+ components this adds ~11s blocking time on Lighthouse/CWV.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the linked reproduction: run pnpm install and pnpm build:analyzer, then inspect the analyzer output for /, /dashboard, and /dashboard/users. Trace why Button.module.scss is included outside the home and not-found routes; done means it loads only where Button is used and no longer blocks unrelated routes.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css, javascript, nextjs, react
- Domain
- build-system, frontend, performance
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 48/100