fix: use compiler context for CSS modules hash to avoid collisions#20799
fix: use compiler context for CSS modules hash to avoid collisions#20799alexander-akait merged 3 commits intomainfrom
Conversation
…ectories Files with the same name in different directories (e.g. f1/style.module.css and f2/style.module.css) generate identical hashed class names, causing style collisions. Ref: #20795
Use compiler.context instead of module.context as the base path when computing relativeResourcePath for CSS module local ident hashing. Previously, files with the same name in different directories would produce identical relative paths (both "./style.module.css"), leading to hash collisions. Fixes #20795
🦋 Changeset detectedLatest commit: b9497d8 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
This PR is packaged and the instant preview is available (ecb436b). Install it locally:
npm i -D webpack@https://pkg.pr.new/webpack@ecb436b
yarn add -D webpack@https://pkg.pr.new/webpack@ecb436b
pnpm add -D webpack@https://pkg.pr.new/webpack@ecb436b |
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #20799 +/- ##
=======================================
Coverage 91.38% 91.39%
=======================================
Files 560 560
Lines 55298 55298
Branches 14595 14595
=======================================
+ Hits 50533 50537 +4
+ Misses 4765 4761 -4
Flags with carried forward coverage won't be shown. Click here to find out more. ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
Merging this PR will degrade performance by 89.27%
|
| Mode | Benchmark | BASE |
HEAD |
Efficiency | |
|---|---|---|---|---|---|
| ⚡ | Memory | benchmark "asset-modules-resource", scenario '{"name":"mode-development-rebuild","mode":"development","watch":true}' |
996.7 KB | 736.3 KB | +35.36% |
| ❌ | Memory | benchmark "many-modules-esm", scenario '{"name":"mode-development-rebuild","mode":"development","watch":true}' |
298 KB | 805.3 KB | -62.99% |
| ⚡ | Memory | benchmark "concatenate-modules", scenario '{"name":"mode-development-rebuild","mode":"development","watch":true}' |
776.3 KB | 555.6 KB | +39.72% |
| ❌ | Memory | benchmark "json-modules", scenario '{"name":"mode-development-rebuild","mode":"development","watch":true}' |
412.7 KB | 990.7 KB | -58.34% |
| ⚡ | Memory | benchmark "react", scenario '{"name":"mode-development-rebuild","mode":"development","watch":true}' |
865 KB | 645.3 KB | +34.04% |
| ⚡ | Memory | benchmark "asset-modules-source", scenario '{"name":"mode-development-rebuild","mode":"development","watch":true}' |
339.3 KB | 265.5 KB | +27.78% |
| ❌ | Memory | benchmark "asset-modules-source", scenario '{"name":"mode-development","mode":"development"}' |
660.9 KB | 919.8 KB | -28.15% |
| ❌ | Memory | benchmark "asset-modules-inline", scenario '{"name":"mode-development-rebuild","mode":"development","watch":true}' |
734.6 KB | 6,847.8 KB | -89.27% |
| ❌ | Memory | benchmark "many-modules-esm", scenario '{"name":"mode-production","mode":"production"}' |
7.4 MB | 10 MB | -25.41% |
Comparing fix/css-module-hash-collision (b9497d8) with main (e370b76)
Summary
fixes #20795
What kind of change does this PR introduce?
fix
Did you add tests for your changes?
Yes
Does this PR introduce a breaking change?
No
If relevant, what needs to be documented once your changes are merged or what have you already documented?
Nothing
Use of AI
Partial