webpack 5.86.0 → 5.88.0

package/lib/css/CssLoadingRuntimeModule.js

@@ -56,7 +56,7 @@ class CssLoadingRuntimeModule extends RuntimeModule {
 	}
 
 	/**
-	 * @returns {string} runtime code
+	 * @returns {string | null} runtime code
 	 */
 	generate() {
 		const { compilation, chunk, _runtimeRequirements } = this;
@@ -135,6 +135,14 @@ class CssLoadingRuntimeModule extends RuntimeModule {
 
 		/** @type {(str: string) => number} */
 		const cc = str => str.charCodeAt(0);
+		const name = uniqueName
+			? runtimeTemplate.concatenation(
+					"--webpack-",
+					{ expr: "uniqueName" },
+					"-",
+					{ expr: "chunkId" }
+			  )
+			: runtimeTemplate.concatenation("--webpack-", { expr: "chunkId" });
 
 		return Template.asString([
 			"// object to store loaded and loading chunks",
@@ -157,18 +165,27 @@ class CssLoadingRuntimeModule extends RuntimeModule {
 				[
 					`var data, token = "", token2, exports = {}, exportsWithId = [], exportsWithDashes = [], ${
 						withHmr ? "moduleIds = [], " : ""
-					}i = 0, cc = 1;`,
-					"try { if(!link) link = loadStylesheet(chunkId); data = link.sheet.cssRules; data = data[data.length - 1].style; } catch(e) { data = getComputedStyle(document.head); }",
-					`data = data.getPropertyValue(${
-						uniqueName
-							? runtimeTemplate.concatenation(
-									"--webpack-",
-									{ expr: "uniqueName" },
-									"-",
-									{ expr: "chunkId" }
-							  )
-							: runtimeTemplate.concatenation("--webpack-", { expr: "chunkId" })
-					});`,
+					}name = ${name}, i = 0, cc = 1;`,
+					"try {",
+					Template.indent([
+						"if(!link) link = loadStylesheet(chunkId);",
+						// `link.sheet.rules` for legacy browsers
+						"var cssRules = link.sheet.cssRules || link.sheet.rules;",
+						"var j = cssRules.length - 1;",
+						"while(j > -1 && !data) {",
+						Template.indent([
+							"var style = cssRules[j--].style;",
+							"if(!style) continue;",
+							`data = style.getPropertyValue(name);`
+						]),
+						"}"
+					]),
+					"}catch(e){}",
+					"if(!data) {",
+					Template.indent([
+						"data = getComputedStyle(document.head).getPropertyValue(name);"
+					]),
+					"}",
 					"if(!data) return [];",
 					"for(; cc; i++) {",
 					Template.indent([

package/lib/css/CssModulesPlugin.js

@@ -11,7 +11,8 @@ const HotUpdateChunk = require("../HotUpdateChunk");
 const {
 	CSS_MODULE_TYPE,
 	CSS_MODULE_TYPE_GLOBAL,
-	CSS_MODULE_TYPE_MODULE
+	CSS_MODULE_TYPE_MODULE,
+	CSS_MODULE_TYPE_AUTO
 } = require("../ModuleTypeConstants");
 const RuntimeGlobals = require("../RuntimeGlobals");
 const SelfModuleFactory = require("../SelfModuleFactory");
@@ -149,7 +150,8 @@ class CssModulesPlugin {
 				for (const type of [
 					CSS_MODULE_TYPE,
 					CSS_MODULE_TYPE_GLOBAL,
-					CSS_MODULE_TYPE_MODULE
+					CSS_MODULE_TYPE_MODULE,
+					CSS_MODULE_TYPE_AUTO
 				]) {
 					normalModuleFactory.hooks.createParser
 						.for(type)
@@ -158,6 +160,7 @@ class CssModulesPlugin {
 
 							switch (type) {
 								case CSS_MODULE_TYPE:
+								case CSS_MODULE_TYPE_AUTO:
 									return new CssParser();
 								case CSS_MODULE_TYPE_GLOBAL:
 									return new CssParser({

package/lib/css/CssParser.js

@@ -6,6 +6,7 @@
 "use strict";
 
 const ModuleDependencyWarning = require("../ModuleDependencyWarning");
+const { CSS_MODULE_TYPE_AUTO } = require("../ModuleTypeConstants");
 const Parser = require("../Parser");
 const WebpackError = require("../WebpackError");
 const ConstDependency = require("../dependencies/ConstDependency");
@@ -15,6 +16,7 @@ const CssLocalIdentifierDependency = require("../dependencies/CssLocalIdentifier
 const CssSelfLocalIdentifierDependency = require("../dependencies/CssSelfLocalIdentifierDependency");
 const CssUrlDependency = require("../dependencies/CssUrlDependency");
 const StaticExportsDependency = require("../dependencies/StaticExportsDependency");
+const { parseResource } = require("../util/identifier");
 const walkCssTokens = require("./walkCssTokens");
 
 /** @typedef {import("../Parser").ParserState} ParserState */
@@ -37,6 +39,7 @@ const IMAGE_SET_FUNCTION = /^(-\w+-)?image-set$/i;
 const OPTIONALLY_VENDOR_PREFIXED_KEYFRAMES_AT_RULE = /^@(-\w+-)?keyframes$/;
 const OPTIONALLY_VENDOR_PREFIXED_ANIMATION_PROPERTY =
 	/^(-\w+-)?animation(-name)?$/i;
+const IS_MODULES = /\.module(s)?\.[^.]+$/i;
 
 /**
  * @param {string} str url string
@@ -169,6 +172,21 @@ class CssParser extends Parser {
 		}
 
 		const module = state.module;
+
+		/** @type {string | undefined} */
+		let oldDefaultMode;
+
+		if (
+			module.type === CSS_MODULE_TYPE_AUTO &&
+			IS_MODULES.test(
+				parseResource(module.matchResource || module.resource).path
+			)
+		) {
+			oldDefaultMode = this.defaultMode;
+
+			this.defaultMode = "local";
+		}
+
 		const locConverter = new LocConverter(source);
 		/** @type {Set<string>}*/
 		const declaredCssVariables = new Set();
@@ -1001,6 +1019,10 @@ class CssParser extends Parser {
 			}
 		});
 
+		if (oldDefaultMode) {
+			this.defaultMode = oldDefaultMode;
+		}
+
 		module.buildInfo.strict = true;
 		module.buildMeta.exportsType = "namespace";
 		module.addDependency(new StaticExportsDependency([], true));

package/lib/dependencies/AMDDefineDependency.js

@@ -180,6 +180,10 @@ AMDDefineDependency.Template = class AMDDefineDependencyTemplate extends (
 		this.replace(dep, source, definition, content);
 	}
 
+	/**
+	 * @param {AMDDefineDependency} dependency dependency
+	 * @returns {string} variable name
+	 */
 	localModuleVar(dependency) {
 		return (
 			dependency.localModule &&
@@ -188,6 +192,10 @@ AMDDefineDependency.Template = class AMDDefineDependencyTemplate extends (
 		);
 	}
 
+	/**
+	 * @param {AMDDefineDependency} dependency dependency
+	 * @returns {string} branch
+	 */
 	branch(dependency) {
 		const localModuleVar = this.localModuleVar(dependency) ? "l" : "";
 		const arrayRange = dependency.arrayRange ? "a" : "";
@@ -196,6 +204,12 @@ AMDDefineDependency.Template = class AMDDefineDependencyTemplate extends (
 		return localModuleVar + arrayRange + objectRange + functionRange;
 	}
 
+	/**
+	 * @param {AMDDefineDependency} dependency dependency
+	 * @param {ReplaceSource} source source
+	 * @param {string} definition definition
+	 * @param {string} text text
+	 */
 	replace(dependency, source, definition, text) {
 		const localModuleVar = this.localModuleVar(dependency);
 		if (localModuleVar) {
@@ -216,18 +230,34 @@ AMDDefineDependency.Template = class AMDDefineDependencyTemplate extends (
 
 		let current = dependency.range[0];
 		if (dependency.arrayRange) {
-			source.replace(current, dependency.arrayRange[0] - 1, texts.shift());
+			source.replace(
+				current,
+				dependency.arrayRange[0] - 1,
+				/** @type {string} */ (texts.shift())
+			);
 			current = dependency.arrayRange[1];
 		}
 
 		if (dependency.objectRange) {
-			source.replace(current, dependency.objectRange[0] - 1, texts.shift());
+			source.replace(
+				current,
+				dependency.objectRange[0] - 1,
+				/** @type {string} */ (texts.shift())
+			);
 			current = dependency.objectRange[1];
 		} else if (dependency.functionRange) {
-			source.replace(current, dependency.functionRange[0] - 1, texts.shift());
+			source.replace(
+				current,
+				dependency.functionRange[0] - 1,
+				/** @type {string} */ (texts.shift())
+			);
 			current = dependency.functionRange[1];
 		}
-		source.replace(current, dependency.range[1] - 1, texts.shift());
+		source.replace(
+			current,
+			dependency.range[1] - 1,
+			/** @type {string} */ (texts.shift())
+		);
 		if (texts.length > 0) throw new Error("Implementation error");
 	}
 };

package/lib/dependencies/AMDDefineDependencyParserPlugin.js

@@ -16,8 +16,13 @@ const DynamicExports = require("./DynamicExports");
 const LocalModuleDependency = require("./LocalModuleDependency");
 const { addLocalModule, getLocalModule } = require("./LocalModulesHelpers");
 
+/** @typedef {import("estree").CallExpression} CallExpression */
 /** @typedef {import("../javascript/JavascriptParser")} JavascriptParser */
 
+/**
+ * @param {CallExpression} expr expression
+ * @returns {boolean} true if it's a bound function expression
+ */
 const isBoundFunctionExpression = expr => {
 	if (expr.type !== "CallExpression") return false;
 	if (expr.callee.type !== "MemberExpression") return false;

package/lib/dependencies/AMDRuntimeModules.js

@@ -14,7 +14,7 @@ class AMDDefineRuntimeModule extends RuntimeModule {
 	}
 
 	/**
-	 * @returns {string} runtime code
+	 * @returns {string | null} runtime code
 	 */
 	generate() {
 		return Template.asString([
@@ -35,7 +35,7 @@ class AMDOptionsRuntimeModule extends RuntimeModule {
 	}
 
 	/**
-	 * @returns {string} runtime code
+	 * @returns {string | null} runtime code
 	 */
 	generate() {
 		return Template.asString([

package/lib/dependencies/CommonJsExportsParserPlugin.js

@@ -21,6 +21,7 @@ const ModuleDecoratorDependency = require("./ModuleDecoratorDependency");
 /** @typedef {import("estree").Expression} Expression */
 /** @typedef {import("estree").Super} Super */
 
+/** @typedef {import("../ModuleGraph")} ModuleGraph */
 /** @typedef {import("../NormalModule")} NormalModule */
 /** @typedef {import("../javascript/BasicEvaluatedExpression")} BasicEvaluatedExpression */
 /** @typedef {import("../javascript/JavascriptParser")} JavascriptParser */
@@ -43,7 +44,7 @@ const ModuleDecoratorDependency = require("./ModuleDecoratorDependency");
  * ```
  *
  * @param {TODO} expr expression
- * @returns {Expression} returns the value of property descriptor
+ * @returns {Expression | undefined} returns the value of property descriptor
  */
 const getValueOfPropertyDescription = expr => {
 	if (expr.type !== "ObjectExpression") return;
@@ -127,6 +128,9 @@ const parseRequireCall = (parser, expr) => {
 };
 
 class CommonJsExportsParserPlugin {
+	/**
+	 * @param {ModuleGraph} moduleGraph module graph
+	 */
 	constructor(moduleGraph) {
 		this.moduleGraph = moduleGraph;
 	}
@@ -143,7 +147,7 @@ class CommonJsExportsParserPlugin {
 		/**
 		 * @param {boolean} topLevel true, when the export is on top level
 		 * @param {string[]} members members of the export
-		 * @param {Expression} valueExpr expression for the value
+		 * @param {Expression | undefined} valueExpr expression for the value
 		 * @returns {void}
 		 */
 		const checkNamespace = (topLevel, members, valueExpr) => {
@@ -156,10 +160,16 @@ class CommonJsExportsParserPlugin {
 				}
 			}
 		};
+		/**
+		 * @param {string=} reason reason
+		 */
 		const bailout = reason => {
 			DynamicExports.bailout(parser.state);
 			if (reason) bailoutHint(reason);
 		};
+		/**
+		 * @param {string} reason reason
+		 */
 		const bailoutHint = reason => {
 			this.moduleGraph
 				.getOptimizationBailout(parser.state.module)
@@ -292,8 +302,8 @@ class CommonJsExportsParserPlugin {
 		 * @param {Expression | Super} expr expression
 		 * @param {CommonJSDependencyBaseKeywords} base commonjs base keywords
 		 * @param {string[]} members members of the export
-		 * @param {CallExpression} call call expression
-		 * @returns {boolean} true, when the expression was handled
+		 * @param {CallExpression=} call call expression
+		 * @returns {boolean | void} true, when the expression was handled
 		 */
 		const handleAccessExport = (expr, base, members, call = undefined) => {
 			if (HarmonyExports.isEnabled(parser.state)) return;