Sitelet https://github.com/webpack/webpack/pull/20579/commits/498b8198bc2b6c5c4cc671cfaf8105935c7cbb8a
Skip to content

feat(css): add exportType style to inject styles into DOM #20579

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
alexander-akait merged 7 commits into from
Mar 10, 2026
Merged

feat(css): add exportType style to inject styles into DOM #20579

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
498b819
feat(css): add exportType style to inject styles into DOM
xiaoxiaojx Feb 28, 2026
c0d5c62
update
xiaoxiaojx Mar 7, 2026
786dbd0
update
xiaoxiaojx Mar 7, 2026
22e5792
update
xiaoxiaojx Mar 7, 2026
6c22827
update
xiaoxiaojx Mar 8, 2026
542b6c3
update
xiaoxiaojx Mar 8, 2026
c9535d2
update
xiaoxiaojx Mar 9, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Next Next commit
feat(css): add exportType style to inject styles into DOM
  • Loading branch information
@xiaoxiaojx
xiaoxiaojx committed Mar 7, 2026
commit 498b8198bc2b6c5c4cc671cfaf8105935c7cbb8a
5 changes: 5 additions & 0 deletions .changeset/add-css-export-type-style.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"webpack": minor
---

Add `exportType: "style"` for CSS modules to inject styles into DOM via HTMLStyleElement, similar to style-loader functionality.
23 changes: 1 addition & 22 deletions declarations/WebpackOptions.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -789,7 +789,7 @@ export type CssGeneratorLocalIdentName = string;
/**
* Configure how CSS content is exported as default.
*/
export type CssParserExportType = "link" | "text" | "css-style-sheet";
export type CssParserExportType = "link" | "text" | "css-style-sheet" | "style";
/**
* Enable/disable renaming of `@keyframes`.
*/
Expand Down Expand Up @@ -1385,17 +1385,14 @@ export interface ModuleOptions {
*/
exprContextCritical?: boolean;
/**
* @deprecated
* Enable recursive directory lookup for full dynamic dependencies. Deprecated: This option has moved to 'module.parser.javascript.exprContextRecursive'.
*/
exprContextRecursive?: boolean;
/**
* @deprecated
* Sets the default regular expression for full dynamic dependencies. Deprecated: This option has moved to 'module.parser.javascript.exprContextRegExp'.
*/
exprContextRegExp?: RegExp | boolean;
/**
* @deprecated
* Set the default request for full dynamic dependencies. Deprecated: This option has moved to 'module.parser.javascript.exprContextRequest'.
*/
exprContextRequest?: string;
Expand All @@ -1416,32 +1413,26 @@ export interface ModuleOptions {
*/
rules?: RuleSetRules;
/**
* @deprecated
* Emit errors instead of warnings when imported names don't exist in imported module. Deprecated: This option has moved to 'module.parser.javascript.strictExportPresence'.
*/
strictExportPresence?: boolean;
/**
* @deprecated
* Handle the this context correctly according to the spec for namespace objects. Deprecated: This option has moved to 'module.parser.javascript.strictThisContextOnImports'.
*/
strictThisContextOnImports?: boolean;
/**
* @deprecated
* Enable warnings when using the require function in a not statically analyse-able way. Deprecated: This option has moved to 'module.parser.javascript.unknownContextCritical'.
*/
unknownContextCritical?: boolean;
/**
* @deprecated
* Enable recursive directory lookup when using the require function in a not statically analyse-able way. Deprecated: This option has moved to 'module.parser.javascript.unknownContextRecursive'.
*/
unknownContextRecursive?: boolean;
/**
* @deprecated
* Sets the regular expression when using the require function in a not statically analyse-able way. Deprecated: This option has moved to 'module.parser.javascript.unknownContextRegExp'.
*/
unknownContextRegExp?: RegExp | boolean;
/**
* @deprecated
* Sets the request when using the require function in a not statically analyse-able way. Deprecated: This option has moved to 'module.parser.javascript.unknownContextRequest'.
*/
unknownContextRequest?: string;
Expand All @@ -1450,17 +1441,14 @@ export interface ModuleOptions {
*/
unsafeCache?: boolean | import("../lib/Compilation").UnsafeCachePredicate;
/**
* @deprecated
* Enable warnings for partial dynamic dependencies. Deprecated: This option has moved to 'module.parser.javascript.wrappedContextCritical'.
*/
wrappedContextCritical?: boolean;
/**
* @deprecated
* Enable recursive directory lookup for partial dynamic dependencies. Deprecated: This option has moved to 'module.parser.javascript.wrappedContextRecursive'.
*/
wrappedContextRecursive?: boolean;
/**
* @deprecated
* Set the inner regular expression for partial dynamic dependencies. Deprecated: This option has moved to 'module.parser.javascript.wrappedContextRegExp'.
*/
wrappedContextRegExp?: RegExp;
Expand Down Expand Up @@ -1861,12 +1849,10 @@ export interface Optimization {
*/
minimizer?: ("..." | Falsy | WebpackPluginInstance | WebpackPluginFunction)[];
/**
* @deprecated
* Define the algorithm to choose module ids (natural: numeric ids in order of usage, named: readable ids for better debugging, hashed: (deprecated) short hashes as ids for better long term caching, deterministic: numeric hash ids for better long term caching, size: numeric ids focused on minimal initial download size, false: no algorithm used, as custom one can be provided via plugin).
*/
moduleIds?: "natural" | "named" | "hashed" | "deterministic" | "size" | false;
/**
* @deprecated
* Avoid emitting assets when errors occur (deprecated: use 'emitOnErrors' instead).
*/
noEmitOnErrors?: boolean;
Expand Down Expand Up @@ -2341,7 +2327,6 @@ export interface Output {
*/
strictModuleErrorHandling?: StrictModuleErrorHandling;
/**
* @deprecated
* Handles exceptions in module loading correctly at a performance cost (Deprecated). This will handle module error compatible with the Node.js CommonJS way.
*/
strictModuleExceptionHandling?: StrictModuleExceptionHandling;
Expand Down Expand Up @@ -2601,7 +2586,6 @@ export interface StatsOptions {
*/
builtAt?: boolean;
/**
* @deprecated
* Add information about cached (not built) modules (deprecated: use 'cachedModules' instead).
*/
cached?: boolean;
Expand Down Expand Up @@ -2885,7 +2869,6 @@ export interface StatsOptions {
*/
relatedAssets?: boolean;
/**
* @deprecated
* Add information about runtime modules (deprecated: use 'runtimeModules' instead).
*/
runtime?: boolean;
Expand Down Expand Up @@ -3381,7 +3364,6 @@ export interface JavascriptParserOptions {
*/
requireJs?: boolean;
/**
* @deprecated
* Deprecated in favor of "exportsPresence". Emit errors instead of warnings when imported names don't exist in imported module.
*/
strictExportPresence?: boolean;
Expand Down Expand Up @@ -3594,12 +3576,10 @@ export interface OptimizationNormalized {
*/
minimizer?: ("..." | WebpackPluginInstance | WebpackPluginFunction)[];
/**
* @deprecated
* Define the algorithm to choose module ids (natural: numeric ids in order of usage, named: readable ids for better debugging, hashed: (deprecated) short hashes as ids for better long term caching, deterministic: numeric hash ids for better long term caching, size: numeric ids focused on minimal initial download size, false: no algorithm used, as custom one can be provided via plugin).
*/
moduleIds?: "natural" | "named" | "hashed" | "deterministic" | "size" | false;
/**
* @deprecated
* Avoid emitting assets when errors occur (deprecated: use 'emitOnErrors' instead).
*/
noEmitOnErrors?: boolean;
Expand Down Expand Up @@ -3817,7 +3797,6 @@ export interface OutputNormalized {
*/
strictModuleErrorHandling?: StrictModuleErrorHandling;
/**
* @deprecated
* Handles exceptions in module loading correctly at a performance cost (Deprecated). This will handle module error compatible with the Node.js CommonJS way.
*/
strictModuleExceptionHandling?: StrictModuleExceptionHandling;
Expand Down
1 change: 1 addition & 0 deletions lib/RuntimeGlobals.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -82,6 +82,7 @@ module.exports.createScriptUrl = "__webpack_require__.tu";
* merge multiple CSS stylesheets (CSSStyleSheet or string) into one CSS text string
* Arguments: (sheets: Array<CSSStyleSheet | string> | CSSStyleSheet | string) => string
*/
module.exports.cssInjectStyle = "__webpack_require__.is";
module.exports.cssMergeStyleSheets = "__webpack_require__.mcs";

/**
Expand Down
Loading