webpack 5.88.2 → 5.90.0

package/lib/css/CssModulesPlugin.js

@@ -33,7 +33,6 @@ const CssGenerator = require("./CssGenerator");
 const CssParser = require("./CssParser");
 
 /** @typedef {import("webpack-sources").Source} Source */
-/** @typedef {import("../../declarations/WebpackOptions").CssExperimentOptions} CssExperimentOptions */
 /** @typedef {import("../../declarations/WebpackOptions").Output} OutputOptions */
 /** @typedef {import("../Chunk")} Chunk */
 /** @typedef {import("../ChunkGraph")} ChunkGraph */
@@ -59,22 +58,59 @@ const getSchema = name => {
 	};
 };
 
-const validateGeneratorOptions = createSchemaValidation(
-	require("../../schemas/plugins/css/CssGeneratorOptions.check.js"),
-	() => getSchema("CssGeneratorOptions"),
-	{
-		name: "Css Modules Plugin",
-		baseDataPath: "parser"
-	}
-);
-const validateParserOptions = createSchemaValidation(
-	require("../../schemas/plugins/css/CssParserOptions.check.js"),
-	() => getSchema("CssParserOptions"),
-	{
-		name: "Css Modules Plugin",
-		baseDataPath: "parser"
-	}
-);
+const generatorValidationOptions = {
+	name: "Css Modules Plugin",
+	baseDataPath: "generator"
+};
+const validateGeneratorOptions = {
+	css: createSchemaValidation(
+		require("../../schemas/plugins/css/CssGeneratorOptions.check.js"),
+		() => getSchema("CssGeneratorOptions"),
+		generatorValidationOptions
+	),
+	"css/auto": createSchemaValidation(
+		require("../../schemas/plugins/css/CssAutoGeneratorOptions.check.js"),
+		() => getSchema("CssAutoGeneratorOptions"),
+		generatorValidationOptions
+	),
+	"css/module": createSchemaValidation(
+		require("../../schemas/plugins/css/CssModuleGeneratorOptions.check.js"),
+		() => getSchema("CssModuleGeneratorOptions"),
+		generatorValidationOptions
+	),
+	"css/global": createSchemaValidation(
+		require("../../schemas/plugins/css/CssGlobalGeneratorOptions.check.js"),
+		() => getSchema("CssGlobalGeneratorOptions"),
+		generatorValidationOptions
+	)
+};
+
+const parserValidationOptions = {
+	name: "Css Modules Plugin",
+	baseDataPath: "parser"
+};
+const validateParserOptions = {
+	css: createSchemaValidation(
+		require("../../schemas/plugins/css/CssParserOptions.check.js"),
+		() => getSchema("CssParserOptions"),
+		parserValidationOptions
+	),
+	"css/auto": createSchemaValidation(
+		require("../../schemas/plugins/css/CssAutoParserOptions.check.js"),
+		() => getSchema("CssAutoParserOptions"),
+		parserValidationOptions
+	),
+	"css/module": createSchemaValidation(
+		require("../../schemas/plugins/css/CssModuleParserOptions.check.js"),
+		() => getSchema("CssModuleParserOptions"),
+		parserValidationOptions
+	),
+	"css/global": createSchemaValidation(
+		require("../../schemas/plugins/css/CssGlobalParserOptions.check.js"),
+		() => getSchema("CssGlobalParserOptions"),
+		parserValidationOptions
+	)
+};
 
 /**
  * @param {string} str string
@@ -95,12 +131,6 @@ const escapeCss = (str, omitOptionalUnderscore) => {
 const plugin = "CssModulesPlugin";
 
 class CssModulesPlugin {
-	/**
-	 * @param {CssExperimentOptions} options options
-	 */
-	constructor({ exportsOnly = false }) {
-		this._exportsOnly = exportsOnly;
-	}
 	/**
 	 * Apply the plugin
 	 * @param {Compiler} compiler the compiler instance
@@ -156,27 +186,33 @@ class CssModulesPlugin {
 					normalModuleFactory.hooks.createParser
 						.for(type)
 						.tap(plugin, parserOptions => {
-							validateParserOptions(parserOptions);
+							validateParserOptions[type](parserOptions);
+							const { namedExports } = parserOptions;
 
 							switch (type) {
 								case CSS_MODULE_TYPE:
 								case CSS_MODULE_TYPE_AUTO:
-									return new CssParser();
+									return new CssParser({
+										namedExports
+									});
 								case CSS_MODULE_TYPE_GLOBAL:
 									return new CssParser({
-										allowModeSwitch: false
+										allowModeSwitch: false,
+										namedExports
 									});
 								case CSS_MODULE_TYPE_MODULE:
 									return new CssParser({
-										defaultMode: "local"
+										defaultMode: "local",
+										namedExports
 									});
 							}
 						});
 					normalModuleFactory.hooks.createGenerator
 						.for(type)
 						.tap(plugin, generatorOptions => {
-							validateGeneratorOptions(generatorOptions);
-							return this._exportsOnly
+							validateGeneratorOptions[type](generatorOptions);
+
+							return generatorOptions.exportsOnly
 								? new CssExportsGenerator()
 								: new CssGenerator();
 						});
@@ -589,9 +625,9 @@ class CssModulesPlugin {
 									return v === shortcutValue
 										? `${escapeCss(n)}/`
 										: v === "--" + shortcutValue
-										? `${escapeCss(n)}%`
-										: `${escapeCss(n)}(${escapeCss(v)})`;
-							  }).join("")
+											? `${escapeCss(n)}%`
+											: `${escapeCss(n)}(${escapeCss(v)})`;
+								}).join("")
 							: ""
 					}${escapeCss(moduleId)}`
 				);

package/lib/css/CssParser.js

@@ -131,10 +131,15 @@ const CSS_MODE_AT_IMPORT_INVALID = 3;
 const CSS_MODE_AT_NAMESPACE_INVALID = 4;
 
 class CssParser extends Parser {
-	constructor({ allowModeSwitch = true, defaultMode = "global" } = {}) {
+	constructor({
+		allowModeSwitch = true,
+		defaultMode = "global",
+		namedExports = true
+	} = {}) {
 		super();
 		this.allowModeSwitch = allowModeSwitch;
 		this.defaultMode = defaultMode;
+		this.namedExports = namedExports;
 	}
 
 	/**
@@ -911,7 +916,7 @@ class CssParser extends Parser {
 				) {
 					modeData = balanced[balanced.length - 1]
 						? /** @type {"local" | "global"} */
-						  (balanced[balanced.length - 1][0])
+							(balanced[balanced.length - 1][0])
 						: undefined;
 					const dep = new ConstDependency("", [start, end]);
 					module.addPresentationalDependency(dep);
@@ -1024,7 +1029,7 @@ class CssParser extends Parser {
 		}
 
 		module.buildInfo.strict = true;
-		module.buildMeta.exportsType = "namespace";
+		module.buildMeta.exportsType = this.namedExports ? "namespace" : "default";
 		module.addDependency(new StaticExportsDependency([], true));
 		return state;
 	}

package/lib/debug/ProfilingPlugin.js

@@ -31,7 +31,7 @@ const validate = createSchemaValidation(
 let inspector = undefined;
 
 try {
-	// eslint-disable-next-line node/no-unsupported-features/node-builtins
+	// eslint-disable-next-line n/no-unsupported-features/node-builtins
 	inspector = require("inspector");
 } catch (e) {
 	console.log("Unable to CPU profile in < node 8.0");
@@ -374,7 +374,7 @@ const makeInterceptorFor = (instance, tracer) => hookName => ({
 						name,
 						type,
 						fn
-				  });
+					});
 		return {
 			...tapInfo,
 			fn: newFn

package/lib/dependencies/CachedConstDependency.js

@@ -38,6 +38,13 @@ class CachedConstDependency extends NullDependency {
 		this._hashUpdate = undefined;
 	}
 
+	/**
+	 * @returns {string} hash update
+	 */
+	_createHashUpdate() {
+		return `${this.identifier}${this.range}${this.expression}`;
+	}
+
 	/**
 	 * Update the hash
 	 * @param {Hash} hash hash to be updated
@@ -46,7 +53,7 @@ class CachedConstDependency extends NullDependency {
 	 */
 	updateHash(hash, context) {
 		if (this._hashUpdate === undefined)
-			this._hashUpdate = "" + this.identifier + this.range + this.expression;
+			this._hashUpdate = this._createHashUpdate();
 		hash.update(this._hashUpdate);
 	}
 

package/lib/dependencies/CommonJsFullRequireDependency.js

@@ -7,6 +7,7 @@
 
 const Template = require("../Template");
 const { equals } = require("../util/ArrayHelpers");
+const { getTrimmedIdsAndRange } = require("../util/chainedImports");
 const makeSerializable = require("../util/makeSerializable");
 const propertyAccess = require("../util/propertyAccess");
 const ModuleDependency = require("./ModuleDependency");
@@ -26,11 +27,18 @@ class CommonJsFullRequireDependency extends ModuleDependency {
 	 * @param {string} request the request string
 	 * @param {Range} range location in source code
 	 * @param {string[]} names accessed properties on module
+	 * @param {Range[]=} idRanges ranges for members of ids; the two arrays are right-aligned
 	 */
-	constructor(request, range, names) {
+	constructor(
+		request,
+		range,
+		names,
+		idRanges /* TODO webpack 6 make this non-optional. It must always be set to properly trim ids. */
+	) {
 		super(request);
 		this.range = range;
 		this.names = names;
+		this.idRanges = idRanges;
 		this.call = false;
 		this.asiSafe = undefined;
 	}
@@ -60,6 +68,7 @@ class CommonJsFullRequireDependency extends ModuleDependency {
 	serialize(context) {
 		const { write } = context;
 		write(this.names);
+		write(this.idRanges);
 		write(this.call);
 		write(this.asiSafe);
 		super.serialize(context);
@@ -71,6 +80,7 @@ class CommonJsFullRequireDependency extends ModuleDependency {
 	deserialize(context) {
 		const { read } = context;
 		this.names = read();
+		this.idRanges = read();
 		this.call = read();
 		this.asiSafe = read();
 		super.deserialize(context);
@@ -117,15 +127,26 @@ CommonJsFullRequireDependency.Template = class CommonJsFullRequireDependencyTemp
 			weak: dep.weak,
 			runtimeRequirements
 		});
+
+		const {
+			trimmedRange: [trimmedRangeStart, trimmedRangeEnd],
+			trimmedIds
+		} = getTrimmedIdsAndRange(
+			dep.names,
+			dep.range,
+			dep.idRanges,
+			moduleGraph,
+			dep
+		);
+
 		if (importedModule) {
-			const ids = dep.names;
 			const usedImported = moduleGraph
 				.getExportsInfo(importedModule)
-				.getUsedName(ids, runtime);
+				.getUsedName(trimmedIds, runtime);
 			if (usedImported) {
-				const comment = equals(usedImported, ids)
+				const comment = equals(usedImported, trimmedIds)
 					? ""
-					: Template.toNormalComment(propertyAccess(ids)) + " ";
+					: Template.toNormalComment(propertyAccess(trimmedIds)) + " ";
 				const access = `${comment}${propertyAccess(usedImported)}`;
 				requireExpr =
 					dep.asiSafe === true
@@ -133,7 +154,7 @@ CommonJsFullRequireDependency.Template = class CommonJsFullRequireDependencyTemp
 						: `${requireExpr}${access}`;
 			}
 		}
-		source.replace(dep.range[0], dep.range[1] - 1, requireExpr);
+		source.replace(trimmedRangeStart, trimmedRangeEnd - 1, requireExpr);
 	}
 };
 

package/lib/dependencies/CommonJsImportsParserPlugin.js

@@ -65,7 +65,7 @@ class CommonJsImportsParserPlugin {
 
 		//#region metadata
 		/**
-		 * @param {TODO} expression expression
+		 * @param {string} expression expression
 		 * @param {() => string[]} getMembers get members
 		 */
 		const tapRequireExpression = (expression, getMembers) => {
@@ -379,9 +379,16 @@ class CommonJsImportsParserPlugin {
 		 * @param {string[]} calleeMembers callee members
 		 * @param {CallExpression} callExpr call expression
 		 * @param {string[]} members members
+		 * @param {Range[]} memberRanges member ranges
 		 * @returns {boolean | void} true when handled
 		 */
-		const chainHandler = (expr, calleeMembers, callExpr, members) => {
+		const chainHandler = (
+			expr,
+			calleeMembers,
+			callExpr,
+			members,
+			memberRanges
+		) => {
 			if (callExpr.arguments.length !== 1) return;
 			const param = parser.evaluateExpression(callExpr.arguments[0]);
 			if (
@@ -391,7 +398,8 @@ class CommonJsImportsParserPlugin {
 				const dep = new CommonJsFullRequireDependency(
 					/** @type {string} */ (param.string),
 					/** @type {Range} */ (expr.range),
-					members
+					members,
+					/** @type {Range[]} */ memberRanges
 				);
 				dep.asiSafe = !parser.isAsiPosition(
 					/** @type {Range} */ (expr.range)[0]
@@ -407,9 +415,16 @@ class CommonJsImportsParserPlugin {
 		 * @param {string[]} calleeMembers callee members
 		 * @param {CallExpression} callExpr call expression
 		 * @param {string[]} members members
+		 * @param {Range[]} memberRanges member ranges
 		 * @returns {boolean | void} true when handled
 		 */
-		const callChainHandler = (expr, calleeMembers, callExpr, members) => {
+		const callChainHandler = (
+			expr,
+			calleeMembers,
+			callExpr,
+			members,
+			memberRanges
+		) => {
 			if (callExpr.arguments.length !== 1) return;
 			const param = parser.evaluateExpression(callExpr.arguments[0]);
 			if (
@@ -419,7 +434,8 @@ class CommonJsImportsParserPlugin {
 				const dep = new CommonJsFullRequireDependency(
 					/** @type {string} */ (param.string),
 					/** @type {Range} */ (expr.callee.range),
-					members
+					members,
+					/** @type {Range[]} */ memberRanges
 				);
 				dep.call = true;
 				dep.asiSafe = !parser.isAsiPosition(

package/lib/dependencies/ContextElementDependency.js

@@ -66,7 +66,7 @@ class ContextElementDependency extends ModuleDependency {
 			? this.referencedExports.map(e => ({
 					name: e,
 					canMangle: false
-			  }))
+				}))
 			: Dependency.EXPORTS_OBJECT_REFERENCED;
 	}
 

package/lib/dependencies/ExternalModuleDependency.js

@@ -0,0 +1,98 @@
+/*
+	MIT License http://www.opensource.org/licenses/mit-license.php
+	Author Ivan Kopeykin @vankop
+*/
+
+"use strict";
+
+const makeSerializable = require("../util/makeSerializable");
+const CachedConstDependency = require("./CachedConstDependency");
+const ExternalModuleInitFragment = require("./ExternalModuleInitFragment");
+
+/** @typedef {import("webpack-sources").ReplaceSource} ReplaceSource */
+/** @typedef {import("../Dependency")} Dependency */
+/** @typedef {import("../Dependency").UpdateHashContext} UpdateHashContext */
+/** @typedef {import("../DependencyTemplate").DependencyTemplateContext} DependencyTemplateContext */
+/** @typedef {import("../javascript/JavascriptModulesPlugin").ChunkRenderContext} ChunkRenderContext */
+/** @typedef {import("../serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
+/** @typedef {import("../serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */
+/** @typedef {import("../util/Hash")} Hash */
+
+class ExternalModuleDependency extends CachedConstDependency {
+	constructor(
+		module,
+		importSpecifiers,
+		defaultImport,
+		expression,
+		range,
+		identifier
+	) {
+		super(expression, range, identifier);
+
+		this.importedModule = module;
+		this.specifiers = importSpecifiers;
+		this.default = defaultImport;
+	}
+
+	/**
+	 * @returns {string} hash update
+	 */
+	_createHashUpdate() {
+		return `${this.importedModule}${JSON.stringify(this.specifiers)}${
+			this.default || "null"
+		}${super._createHashUpdate()}`;
+	}
+
+	/**
+	 * @param {ObjectSerializerContext} context context
+	 */
+	serialize(context) {
+		super.serialize(context);
+		const { write } = context;
+		write(this.importedModule);
+		write(this.specifiers);
+		write(this.default);
+	}
+
+	/**
+	 * @param {ObjectDeserializerContext} context context
+	 */
+	deserialize(context) {
+		super.deserialize(context);
+		const { read } = context;
+		this.importedModule = read();
+		this.specifiers = read();
+		this.default = read();
+	}
+}
+
+makeSerializable(
+	ExternalModuleDependency,
+	"webpack/lib/dependencies/ExternalModuleDependency"
+);
+
+ExternalModuleDependency.Template = class ExternalModuleDependencyTemplate extends (
+	CachedConstDependency.Template
+) {
+	/**
+	 * @param {Dependency} dependency the dependency for which the template should be applied
+	 * @param {ReplaceSource} source the current replace source which can be modified
+	 * @param {DependencyTemplateContext} templateContext the context object
+	 * @returns {void}
+	 */
+	apply(dependency, source, templateContext) {
+		super.apply(dependency, source, templateContext);
+		const dep = /** @type {ExternalModuleDependency} */ (dependency);
+		const { chunkInitFragments } = templateContext;
+
+		chunkInitFragments.push(
+			new ExternalModuleInitFragment(
+				dep.importedModule,
+				dep.specifiers,
+				dep.default
+			)
+		);
+	}
+};
+
+module.exports = ExternalModuleDependency;

package/lib/dependencies/ExternalModuleInitFragment.js

@@ -0,0 +1,124 @@
+/*
+	MIT License http://www.opensource.org/licenses/mit-license.php
+	Author Ivan Kopeykin @vankop
+*/
+
+"use strict";
+
+const InitFragment = require("../InitFragment");
+const makeSerializable = require("../util/makeSerializable");
+
+/** @typedef {import("webpack-sources").Source} Source */
+/** @typedef {import("../Generator").GenerateContext} Context */
+/** @typedef {import("../serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
+/** @typedef {import("../serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */
+/** @typedef {Map<string, Set<string>>} ImportSpecifiers */
+
+class ExternalModuleInitFragment extends InitFragment {
+	/**
+	 * @param {string} importedModule imported module
+	 * @param {Array<{ name: string, value?: string }>|ImportSpecifiers} specifiers import specifiers
+	 * @param {string=} defaultImport default import
+	 */
+	constructor(importedModule, specifiers, defaultImport) {
+		super(
+			undefined,
+			InitFragment.STAGE_CONSTANTS,
+			0,
+			`external module imports|${importedModule}|${defaultImport || "null"}`
+		);
+		this.importedModule = importedModule;
+		if (Array.isArray(specifiers)) {
+			/** @type {ImportSpecifiers} */
+			this.specifiers = new Map();
+			for (const { name, value } of specifiers) {
+				let specifiers = this.specifiers.get(name);
+				if (!specifiers) {
+					specifiers = new Set();
+					this.specifiers.set(name, specifiers);
+				}
+				specifiers.add(value || name);
+			}
+		} else {
+			this.specifiers = specifiers;
+		}
+		this.defaultImport = defaultImport;
+	}
+
+	merge(other) {
+		const newSpecifiersMap = new Map(this.specifiers);
+		for (const [name, specifiers] of other.specifiers) {
+			if (newSpecifiersMap.has(name)) {
+				const currentSpecifiers = newSpecifiersMap.get(name);
+				for (const spec of specifiers) currentSpecifiers.add(spec);
+			} else {
+				newSpecifiersMap.set(name, specifiers);
+			}
+		}
+		return new ExternalModuleInitFragment(
+			this.importedModule,
+			newSpecifiersMap,
+			this.defaultImport
+		);
+	}
+
+	/**
+	 * @param {Context} context context
+	 * @returns {string|Source} the source code that will be included as initialization code
+	 */
+	getContent({ runtimeRequirements }) {
+		const namedImports = [];
+
+		for (const [name, specifiers] of this.specifiers) {
+			for (const spec of specifiers) {
+				if (spec === name) {
+					namedImports.push(name);
+				} else {
+					namedImports.push(`${name} as ${spec}`);
+				}
+			}
+		}
+
+		let importsString =
+			namedImports.length > 0 ? `{${namedImports.join(",")}}` : "";
+
+		if (this.defaultImport) {
+			importsString = `${this.defaultImport}${
+				importsString ? `, ${importsString}` : ""
+			}`;
+		}
+
+		return `import ${importsString} from ${JSON.stringify(
+			this.importedModule
+		)};`;
+	}
+
+	/**
+	 * @param {ObjectSerializerContext} context context
+	 */
+	serialize(context) {
+		super.serialize(context);
+		const { write } = context;
+		write(this.importedModule);
+		write(this.specifiers);
+		write(this.defaultImport);
+	}
+
+	/**
+	 * @param {ObjectDeserializerContext} context context
+	 */
+	deserialize(context) {
+		super.deserialize(context);
+		const { read } = context;
+		this.importedModule = read();
+		this.specifiers = read();
+		this.defaultImport = read();
+	}
+}
+
+makeSerializable(
+	ExternalModuleInitFragment,
+	"webpack/lib/dependencies/ExternalModuleInitFragment"
+);
+
+module.exports = ExternalModuleInitFragment;

package/lib/dependencies/HarmonyAcceptDependency.js

@@ -91,7 +91,7 @@ HarmonyAcceptDependency.Template = class HarmonyAcceptDependencyTemplate extends
 						? HarmonyImportDependency.Template.getImportEmittedRuntime(
 								module,
 								referencedModule
-						  )
+							)
 						: false
 				};
 			})

package/lib/dependencies/HarmonyDetectionParserPlugin.js

@@ -5,6 +5,7 @@
 
 "use strict";
 
+const EnvironmentNotSupportAsyncWarning = require("../EnvironmentNotSupportAsyncWarning");
 const { JAVASCRIPT_MODULE_TYPE_ESM } = require("../ModuleTypeConstants");
 const DynamicExports = require("./DynamicExports");
 const HarmonyCompatibilityDependency = require("./HarmonyCompatibilityDependency");
@@ -65,7 +66,7 @@ module.exports = class HarmonyDetectionParserPlugin {
 			const module = parser.state.module;
 			if (!this.topLevelAwait) {
 				throw new Error(
-					"The top-level-await experiment is not enabled (set experiments.topLevelAwait: true to enabled it)"
+					"The top-level-await experiment is not enabled (set experiments.topLevelAwait: true to enable it)"
 				);
 			}
 			if (!HarmonyExports.isEnabled(parser.state)) {
@@ -75,6 +76,11 @@ module.exports = class HarmonyDetectionParserPlugin {
 			}
 			/** @type {BuildMeta} */
 			(module.buildMeta).async = true;
+			EnvironmentNotSupportAsyncWarning.check(
+				module,
+				parser.state.compilation.runtimeTemplate,
+				"topLevelAwait"
+			);
 		});
 
 		/**