webpack 5.97.1 → 5.104.1

package/lib/dependencies/ExternalModuleDependency.js

@@ -11,22 +11,21 @@ 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("../javascript/JavascriptParser").Range} Range */
+/** @typedef {import("../dependencies/ExternalModuleInitFragment").ArrayImportSpecifiers} ArrayImportSpecifiers */
 /** @typedef {import("../serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
 /** @typedef {import("../serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */
-/** @typedef {import("../util/Hash")} Hash */
 
 class ExternalModuleDependency extends CachedConstDependency {
 	/**
 	 * @param {string} module module
-	 * @param {{ name: string, value: string }[]} importSpecifiers import specifiers
+	 * @param {ArrayImportSpecifiers} importSpecifiers import specifiers
 	 * @param {string | undefined} defaultImport default import
 	 * @param {string} expression expression
-	 * @param {Range} range range
+	 * @param {Range | null} range range
 	 * @param {string} identifier identifier
+	 * @param {number=} place place where we inject the expression
 	 */
 	constructor(
 		module,
@@ -34,9 +33,10 @@ class ExternalModuleDependency extends CachedConstDependency {
 		defaultImport,
 		expression,
 		range,
-		identifier
+		identifier,
+		place = CachedConstDependency.PLACE_MODULE
 	) {
-		super(expression, range, identifier);
+		super(expression, range, identifier, place);
 
 		this.importedModule = module;
 		this.specifiers = importSpecifiers;

package/lib/dependencies/ExternalModuleInitFragment.js

@@ -12,6 +12,7 @@ const makeSerializable = require("../util/makeSerializable");
 /** @typedef {import("../Generator").GenerateContext} GenerateContext */
 /** @typedef {import("../serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
 /** @typedef {import("../serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */
+/** @typedef {{ name: string, value?: string }[]} ArrayImportSpecifiers */
 /** @typedef {Map<string, Set<string>>} ImportSpecifiers */
 
 /**
@@ -20,7 +21,7 @@ const makeSerializable = require("../util/makeSerializable");
 class ExternalModuleInitFragment extends InitFragment {
 	/**
 	 * @param {string} importedModule imported module
-	 * @param {Array<{ name: string, value?: string }> | ImportSpecifiers} specifiers import specifiers
+	 * @param {ArrayImportSpecifiers | ImportSpecifiers} specifiers import specifiers
 	 * @param {string=} defaultImport default import
 	 */
 	constructor(importedModule, specifiers, defaultImport) {
@@ -99,7 +100,7 @@ class ExternalModuleInitFragment extends InitFragment {
 
 		return `import ${importsString} from ${JSON.stringify(
 			this.importedModule
-		)};`;
+		)};\n`;
 	}
 
 	/**

package/lib/dependencies/ExternalModuleInitFragmentDependency.js

@@ -0,0 +1,96 @@
+/*
+	MIT License http://www.opensource.org/licenses/mit-license.php
+	Author Alexander Akait @alexander-akait
+*/
+
+"use strict";
+
+const DependencyTemplate = require("../DependencyTemplate");
+const makeSerializable = require("../util/makeSerializable");
+const ExternalModuleInitFragment = require("./ExternalModuleInitFragment");
+const NullDependency = require("./NullDependency");
+
+/** @typedef {import("webpack-sources").ReplaceSource} ReplaceSource */
+/** @typedef {import("../Dependency")} Dependency */
+/** @typedef {import("../DependencyTemplate").DependencyTemplateContext} DependencyTemplateContext */
+/** @typedef {import("../javascript/JavascriptParser").Range} Range */
+/** @typedef {import("../dependencies/ExternalModuleInitFragment").ArrayImportSpecifiers} ArrayImportSpecifiers */
+/** @typedef {import("../serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
+/** @typedef {import("../serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */
+
+class ExternalModuleInitFragmentDependency extends NullDependency {
+	/**
+	 * @param {string} module module
+	 * @param {ArrayImportSpecifiers} importSpecifiers import specifiers
+	 * @param {string | undefined} defaultImport default import
+	 */
+	constructor(module, importSpecifiers, defaultImport) {
+		super();
+		this.importedModule = module;
+		this.specifiers = importSpecifiers;
+		this.default = defaultImport;
+	}
+
+	/**
+	 * @returns {string} hash update
+	 */
+	_createHashUpdate() {
+		return `${this.importedModule}${JSON.stringify(this.specifiers)}${
+			this.default || "null"
+		}`;
+	}
+
+	/**
+	 * @param {ObjectSerializerContext} context context
+	 */
+	serialize(context) {
+		const { write } = context;
+		write(this.importedModule);
+		write(this.specifiers);
+		write(this.default);
+	}
+
+	/**
+	 * @param {ObjectDeserializerContext} context context
+	 */
+	deserialize(context) {
+		const { read } = context;
+		this.importedModule = read();
+		this.specifiers = read();
+		this.default = read();
+	}
+}
+
+makeSerializable(
+	ExternalModuleInitFragmentDependency,
+	"webpack/lib/dependencies/ExternalModuleConstDependency"
+);
+
+ExternalModuleInitFragmentDependency.Template = class ExternalModuleConstDependencyTemplate extends (
+	DependencyTemplate
+) {
+	/**
+	 * @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) {
+		const dep =
+			/** @type {ExternalModuleInitFragmentDependency} */
+			(dependency);
+		const { chunkInitFragments, runtimeTemplate } = templateContext;
+
+		chunkInitFragments.push(
+			new ExternalModuleInitFragment(
+				`${runtimeTemplate.supportNodePrefixForCoreModules() ? "node:" : ""}${
+					dep.importedModule
+				}`,
+				dep.specifiers,
+				dep.default
+			)
+		);
+	}
+};
+
+module.exports = ExternalModuleInitFragmentDependency;

package/lib/dependencies/HarmonyAcceptDependency.js

@@ -6,8 +6,10 @@
 "use strict";
 
 const Template = require("../Template");
+const AwaitDependenciesInitFragment = require("../async-modules/AwaitDependenciesInitFragment");
 const makeSerializable = require("../util/makeSerializable");
 const HarmonyImportDependency = require("./HarmonyImportDependency");
+const { ImportPhaseUtils } = require("./ImportPhase");
 const NullDependency = require("./NullDependency");
 
 /** @typedef {import("webpack-sources").ReplaceSource} ReplaceSource */
@@ -17,6 +19,8 @@ const NullDependency = require("./NullDependency");
 /** @typedef {import("../serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
 /** @typedef {import("../serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */
 /** @typedef {import("./HarmonyAcceptImportDependency")} HarmonyAcceptImportDependency */
+/** @typedef {import("../Module")} Module */
+/** @typedef {import("../Module").ModuleId} ModuleId */
 
 class HarmonyAcceptDependency extends NullDependency {
 	/**
@@ -82,8 +86,79 @@ HarmonyAcceptDependency.Template = class HarmonyAcceptDependencyTemplate extends
 			moduleGraph,
 			chunkGraph
 		} = templateContext;
-		const content = dep.dependencies
-			.map(dependency => {
+
+		/**
+		 * @param {Dependency} dependency the dependency to get module id for
+		 * @returns {ModuleId | null} the module id or null if not found
+		 */
+		const getDependencyModuleId = (dependency) =>
+			chunkGraph.getModuleId(
+				/** @type {Module} */ (moduleGraph.getModule(dependency))
+			);
+
+		/**
+		 * @param {Dependency} a the first dependency
+		 * @param {Dependency} b the second dependency
+		 * @returns {boolean} true if the dependencies are related
+		 */
+		const isRelatedHarmonyImportDependency = (a, b) =>
+			a !== b &&
+			b instanceof HarmonyImportDependency &&
+			getDependencyModuleId(a) === getDependencyModuleId(b);
+
+		/**
+		 * HarmonyAcceptImportDependency lacks a lot of information, such as the defer property.
+		 * One HarmonyAcceptImportDependency may need to generate multiple ImportStatements.
+		 * Therefore, we find its original HarmonyImportDependency for code generation.
+		 * @param {HarmonyAcceptImportDependency} dependency the dependency to get harmony import dependencies for
+		 * @returns {HarmonyImportDependency[]} array of related harmony import dependencies
+		 */
+		const getHarmonyImportDependencies = (dependency) => {
+			const result = [];
+			let deferDependency = null;
+			let noDeferredDependency = null;
+
+			for (const d of module.dependencies) {
+				if (deferDependency && noDeferredDependency) break;
+				if (isRelatedHarmonyImportDependency(dependency, d)) {
+					if (
+						ImportPhaseUtils.isDefer(
+							/** @type {HarmonyImportDependency} */ (d).phase
+						)
+					) {
+						deferDependency = /** @type {HarmonyImportDependency} */ (d);
+					} else {
+						noDeferredDependency = /** @type {HarmonyImportDependency} */ (d);
+					}
+				}
+			}
+			if (deferDependency) result.push(deferDependency);
+			if (noDeferredDependency) result.push(noDeferredDependency);
+			if (result.length === 0) {
+				// fallback to the original dependency
+				result.push(dependency);
+			}
+			return result;
+		};
+
+		/** @type {HarmonyImportDependency[]} */
+		const syncDeps = [];
+
+		/** @type {HarmonyAcceptImportDependency[]} */
+		const asyncDeps = [];
+
+		for (const dependency of dep.dependencies) {
+			const connection = moduleGraph.getConnection(dependency);
+
+			if (connection && moduleGraph.isAsync(connection.module)) {
+				asyncDeps.push(dependency);
+			} else {
+				syncDeps.push(...getHarmonyImportDependencies(dependency));
+			}
+		}
+
+		let content = syncDeps
+			.map((dependency) => {
 				const referencedModule = moduleGraph.getModule(dependency);
 				return {
 					dependency,
@@ -112,17 +187,33 @@ HarmonyAcceptDependency.Template = class HarmonyAcceptDependencyTemplate extends
 			})
 			.join("");
 
+		const promises = new Map(
+			asyncDeps.map((dependency) => [
+				dependency.getImportVar(moduleGraph),
+				dependency.getModuleExports(templateContext)
+			])
+		);
+
+		let optAsync = "";
+		if (promises.size !== 0) {
+			optAsync = "async ";
+			content += new AwaitDependenciesInitFragment(promises).getContent({
+				...templateContext,
+				type: "javascript"
+			});
+		}
+
 		if (dep.hasCallback) {
 			if (runtimeTemplate.supportsArrowFunction()) {
 				source.insert(
 					dep.range[0],
-					`__WEBPACK_OUTDATED_DEPENDENCIES__ => { ${content}(`
+					`${optAsync}__WEBPACK_OUTDATED_DEPENDENCIES__ => { ${content} return (`
 				);
 				source.insert(dep.range[1], ")(__WEBPACK_OUTDATED_DEPENDENCIES__); }");
 			} else {
 				source.insert(
 					dep.range[0],
-					`function(__WEBPACK_OUTDATED_DEPENDENCIES__) { ${content}(`
+					`${optAsync}function(__WEBPACK_OUTDATED_DEPENDENCIES__) { ${content} return (`
 				);
 				source.insert(
 					dep.range[1],
@@ -135,7 +226,7 @@ HarmonyAcceptDependency.Template = class HarmonyAcceptDependencyTemplate extends
 		const arrow = runtimeTemplate.supportsArrowFunction();
 		source.insert(
 			dep.range[1] - 0.5,
-			`, ${arrow ? "() =>" : "function()"} { ${content} }`
+			`, ${arrow ? `${optAsync}() =>` : `${optAsync}function()`} { ${content} }`
 		);
 	}
 };

package/lib/dependencies/HarmonyAcceptImportDependency.js

@@ -7,18 +7,15 @@
 
 const makeSerializable = require("../util/makeSerializable");
 const HarmonyImportDependency = require("./HarmonyImportDependency");
+const { ImportPhase } = require("./ImportPhase");
 const NullDependency = require("./NullDependency");
 
-/** @typedef {import("webpack-sources").ReplaceSource} ReplaceSource */
-/** @typedef {import("../Dependency")} Dependency */
-/** @typedef {import("../DependencyTemplate").DependencyTemplateContext} DependencyTemplateContext */
-
 class HarmonyAcceptImportDependency extends HarmonyImportDependency {
 	/**
 	 * @param {string} request the request string
 	 */
 	constructor(request) {
-		super(request, Number.NaN);
+		super(request, Infinity, ImportPhase.Evaluation);
 		this.weak = true;
 	}
 

package/lib/dependencies/HarmonyCompatibilityDependency.js

@@ -14,7 +14,6 @@ const NullDependency = require("./NullDependency");
 /** @typedef {import("webpack-sources").ReplaceSource} ReplaceSource */
 /** @typedef {import("../Dependency")} Dependency */
 /** @typedef {import("../DependencyTemplate").DependencyTemplateContext} DependencyTemplateContext */
-/** @typedef {import("../Module")} Module */
 /** @typedef {import("../Module").BuildMeta} BuildMeta */
 
 class HarmonyCompatibilityDependency extends NullDependency {

package/lib/dependencies/HarmonyDetectionParserPlugin.js

@@ -13,29 +13,22 @@ const HarmonyExports = require("./HarmonyExports");
 
 /** @typedef {import("../Module").BuildMeta} BuildMeta */
 /** @typedef {import("../javascript/JavascriptParser")} JavascriptParser */
-/** @typedef {import("./HarmonyModulesPlugin").HarmonyModulesPluginOptions} HarmonyModulesPluginOptions */
 
-module.exports = class HarmonyDetectionParserPlugin {
-	/**
-	 * @param {HarmonyModulesPluginOptions} options options
-	 */
-	constructor(options) {
-		const { topLevelAwait = false } = options || {};
-		this.topLevelAwait = topLevelAwait;
-	}
+const PLUGIN_NAME = "HarmonyDetectionParserPlugin";
 
+module.exports = class HarmonyDetectionParserPlugin {
 	/**
 	 * @param {JavascriptParser} parser the parser
 	 * @returns {void}
 	 */
 	apply(parser) {
-		parser.hooks.program.tap("HarmonyDetectionParserPlugin", ast => {
+		parser.hooks.program.tap(PLUGIN_NAME, (ast) => {
 			const isStrictHarmony =
 				parser.state.module.type === JAVASCRIPT_MODULE_TYPE_ESM;
 			const isHarmony =
 				isStrictHarmony ||
 				ast.body.some(
-					statement =>
+					(statement) =>
 						statement.type === "ImportDeclaration" ||
 						statement.type === "ExportDefaultDeclaration" ||
 						statement.type === "ExportNamedDeclaration" ||
@@ -62,13 +55,8 @@ module.exports = class HarmonyDetectionParserPlugin {
 			}
 		});
 
-		parser.hooks.topLevelAwait.tap("HarmonyDetectionParserPlugin", () => {
+		parser.hooks.topLevelAwait.tap(PLUGIN_NAME, () => {
 			const module = parser.state.module;
-			if (!this.topLevelAwait) {
-				throw new Error(
-					"The top-level-await experiment is not enabled (set experiments.topLevelAwait: true to enable it)"
-				);
-			}
 			if (!HarmonyExports.isEnabled(parser.state)) {
 				throw new Error(
 					"Top-level-await is only supported in EcmaScript Modules"
@@ -105,19 +93,11 @@ module.exports = class HarmonyDetectionParserPlugin {
 		for (const identifier of nonHarmonyIdentifiers) {
 			parser.hooks.evaluateTypeof
 				.for(identifier)
-				.tap("HarmonyDetectionParserPlugin", nullInHarmony);
-			parser.hooks.typeof
-				.for(identifier)
-				.tap("HarmonyDetectionParserPlugin", skipInHarmony);
-			parser.hooks.evaluate
-				.for(identifier)
-				.tap("HarmonyDetectionParserPlugin", nullInHarmony);
-			parser.hooks.expression
-				.for(identifier)
-				.tap("HarmonyDetectionParserPlugin", skipInHarmony);
-			parser.hooks.call
-				.for(identifier)
-				.tap("HarmonyDetectionParserPlugin", skipInHarmony);
+				.tap(PLUGIN_NAME, nullInHarmony);
+			parser.hooks.typeof.for(identifier).tap(PLUGIN_NAME, skipInHarmony);
+			parser.hooks.evaluate.for(identifier).tap(PLUGIN_NAME, nullInHarmony);
+			parser.hooks.expression.for(identifier).tap(PLUGIN_NAME, skipInHarmony);
+			parser.hooks.call.for(identifier).tap(PLUGIN_NAME, skipInHarmony);
 		}
 	}
 };

package/lib/dependencies/HarmonyEvaluatedImportSpecifierDependency.js

@@ -7,9 +7,9 @@
 
 const makeSerializable = require("../util/makeSerializable");
 const HarmonyImportSpecifierDependency = require("./HarmonyImportSpecifierDependency");
+const { ImportPhase } = require("./ImportPhase");
 
 /** @typedef {import("webpack-sources").ReplaceSource} ReplaceSource */
-/** @typedef {import("../ChunkGraph")} ChunkGraph */
 /** @typedef {import("../Dependency")} Dependency */
 /** @typedef {import("../DependencyTemplate").DependencyTemplateContext} DependencyTemplateContext */
 /** @typedef {import("../Module").BuildMeta} BuildMeta */
@@ -18,6 +18,7 @@ const HarmonyImportSpecifierDependency = require("./HarmonyImportSpecifierDepend
 /** @typedef {import("../javascript/JavascriptParser").Range} Range */
 /** @typedef {import("../serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
 /** @typedef {import("../serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */
+/** @typedef {import("./HarmonyImportDependency").Ids} Ids */
 
 /**
  * Dependency for static evaluating import specifier. e.g.
@@ -30,14 +31,24 @@ class HarmonyEvaluatedImportSpecifierDependency extends HarmonyImportSpecifierDe
 	/**
 	 * @param {string} request the request string
 	 * @param {number} sourceOrder source order
-	 * @param {TODO} ids ids
-	 * @param {TODO} name name
+	 * @param {Ids} ids ids
+	 * @param {string} name name
 	 * @param {Range} range location in source code
-	 * @param {ImportAttributes} attributes import assertions
+	 * @param {ImportAttributes | undefined} attributes import assertions
 	 * @param {string} operator operator
 	 */
 	constructor(request, sourceOrder, ids, name, range, attributes, operator) {
-		super(request, sourceOrder, ids, name, range, false, attributes, []);
+		super(
+			request,
+			sourceOrder,
+			ids,
+			name,
+			range,
+			false,
+			ImportPhase.Evaluation,
+			attributes,
+			[]
+		);
 		this.operator = operator;
 	}
 
@@ -79,9 +90,9 @@ HarmonyEvaluatedImportSpecifierDependency.Template = class HarmonyEvaluatedImpor
 	 * @returns {void}
 	 */
 	apply(dependency, source, templateContext) {
-		const dep = /** @type {HarmonyEvaluatedImportSpecifierDependency} */ (
-			dependency
-		);
+		const dep =
+			/** @type {HarmonyEvaluatedImportSpecifierDependency} */
+			(dependency);
 		const { module, moduleGraph, runtime } = templateContext;
 		const connection = moduleGraph.getConnection(dep);
 		// Skip rendering depending when dependency is conditional