Css fix charset at rule#20831
Conversation
🦋 Changeset detectedLatest commit: 0dc1659 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 (8c7700b). Install it locally:
npm i -D webpack@https://pkg.pr.new/webpack@8c7700b
yarn add -D webpack@https://pkg.pr.new/webpack@8c7700b
pnpm add -D webpack@https://pkg.pr.new/webpack@8c7700b |
Codecov Report❌ Patch coverage is
Additional details and impacted files@@ Coverage Diff @@
## main #20831 +/- ##
==========================================
+ Coverage 91.40% 91.44% +0.04%
==========================================
Files 561 562 +1
Lines 55364 55438 +74
Branches 14604 14636 +32
==========================================
+ Hits 50605 50695 +90
+ Misses 4759 4743 -16
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:
|
There was a problem hiding this comment.
Pull request overview
This PR adds first-class handling of CSS @charset at-rules within webpack’s CSS module pipeline, ensuring a single normalized @charset is emitted at the correct position and warning on conflicts between modules in the same chunk.
Changes:
- Parse
@charsetinCssParser, storing the detected charset inmodule.buildInfoand removing in-module occurrences (non-styleexportType). - Emit a single
@charsetheader at the beginning of rendered CSS chunks and warn when charsets conflict across modules in a chunk. - Add a dedicated
css/charsetconfig case + snapshot updates; extend typing/docs for the newbuildInfo.charsetfield.
Reviewed changes
Copilot reviewed 27 out of 28 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
lib/css/CssParser.js |
Adds parsing/removal of @charset and stores normalized charset in buildInfo. |
lib/css/CssModulesPlugin.js |
Detects conflicting charsets (warnings) and prepends a single @charset to chunk CSS output. |
lib/css/CssGenerator.js |
Prepends @charset for css-style-sheet exportType output where applicable. |
lib/Module.js |
Documents buildInfo.charset in JSDoc. |
types.d.ts |
Adds charset?: string to build info typing. |
test/configCases/css/charset/webpack.config.js |
New test case configuration covering multiple exportTypes with @charset. |
test/configCases/css/charset/test.config.js |
Test harness setup for loading emitted CSS in the browser-like environment. |
test/configCases/css/charset/warnings.js |
Asserts warning output for conflicting @charset values. |
test/configCases/css/charset/index.js |
New runtime assertions/snapshots for link/text/style/css-style-sheet outputs. |
test/configCases/css/charset/styles-1.link.css |
Fixture: UTF-8 charset + imports. |
test/configCases/css/charset/styles-2.link.css |
Fixture: utf-8 charset variant for normalization test. |
test/configCases/css/charset/styles-3.link.css |
Fixture: conflicting/unknown charset to trigger warning. |
test/configCases/css/charset/styles-4.text.css |
Fixture: text exportType with charset + imports. |
test/configCases/css/charset/styles-5.css-style-sheet.css |
Fixture: css-style-sheet exportType with charset + imports. |
test/configCases/css/charset/styles-6.style.css |
Fixture: style exportType with charset + import. |
test/configCases/css/charset/import.link.css |
Fixture: imported link CSS with charset. |
test/configCases/css/charset/import.text.css |
Fixture: imported text CSS with charset + nested imports. |
test/configCases/css/charset/import-nested.text.css |
Fixture: nested import text CSS with charset. |
test/configCases/css/charset/__snapshots__/ConfigTest.snap |
Adds snapshots for the new css/charset config case. |
test/configCases/css/charset/__snapshots__/ConfigCacheTest.snap |
Cache-mode snapshots for the new css/charset config case. |
test/configCases/css/mini-css-extract-plugin/__snapshots__/ConfigTest.snap |
Updates expected output to a single hoisted @charset. |
test/configCases/css/mini-css-extract-plugin/__snapshots__/ConfigCacheTest.snap |
Cache-mode snapshot updates for hoisted @charset. |
test/configCases/css/css-modules/style.module.css |
Fixture changes (class rename + additional declarations) impacting snapshots. |
test/configCases/css/css-modules/__snapshots__/ConfigTest.snap |
Snapshot updates reflecting CSS modules fixture changes. |
test/configCases/css/css-modules/__snapshots__/ConfigCacheTest.snap |
Cache-mode snapshot updates reflecting fixture changes. |
test/configCases/css/pure-css/__snapshots__/ConfigTest.snap |
Snapshot updates reflecting fixture changes. |
test/configCases/css/pure-css/__snapshots__/ConfigCacheTest.snap |
Cache-mode snapshot updates reflecting fixture changes. |
.changeset/spicy-buckets-fetch.md |
Declares a patch release note for @charset handling. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Merging this PR will degrade performance by 45.17%
Performance Changes
Comparing |
Summary
fix - handle
@charsetat-rulesWhat 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
No