webpack 5.97.1 → 5.98.0

package/lib/Compilation.js

@@ -3895,28 +3895,30 @@ Or do you want to use the entrypoints '${name}' and '${runtime}' independently o
 	assignDepths(modules) {
 		const moduleGraph = this.moduleGraph;
 
-		/** @type {Set<Module | number>} */
+		/** @type {Set<Module>} */
 		const queue = new Set(modules);
-		queue.add(1);
+		// Track these in local variables so that queue only has one data type
+		let nextDepthAt = queue.size;
 		let depth = 0;
 
 		let i = 0;
 		for (const module of queue) {
-			i++;
-			if (typeof module === "number") {
-				depth = module;
-				if (queue.size === i) return;
-				queue.add(depth + 1);
-			} else {
-				moduleGraph.setDepth(module, depth);
-				for (const { module: refModule } of moduleGraph.getOutgoingConnections(
-					module
-				)) {
-					if (refModule) {
-						queue.add(refModule);
-					}
+			moduleGraph.setDepth(module, depth);
+			// Some of these results come from cache, which speeds this up
+			const connections = moduleGraph.getOutgoingConnectionsByModule(module);
+			// connections will be undefined if there are no outgoing connections
+			if (connections) {
+				for (const refModule of connections.keys()) {
+					if (refModule) queue.add(refModule);
 				}
 			}
+			i++;
+			// Since this is a breadth-first search, all modules added to the queue
+			// while at depth N will be depth N+1
+			if (i >= nextDepthAt) {
+				depth++;
+				nextDepthAt = queue.size;
+			}
 		}
 	}
 

package/lib/Module.js

@@ -97,10 +97,6 @@ const makeSerializable = require("./util/makeSerializable");
 
 /**
  * @typedef {object} KnownBuildMeta
- * @property {string=} moduleArgument
- * @property {string=} exportsArgument
- * @property {boolean=} strict
- * @property {string=} moduleConcatenationBailout
  * @property {("default" | "namespace" | "flagged" | "dynamic")=} exportsType
  * @property {(false | "redirect" | "redirect-warn")=} defaultObject
  * @property {boolean=} strictHarmonyModule
@@ -113,6 +109,10 @@ const makeSerializable = require("./util/makeSerializable");
  * @typedef {object} KnownBuildInfo
  * @property {boolean=} cacheable
  * @property {boolean=} parsed
+ * @property {string=} moduleArgument
+ * @property {string=} exportsArgument
+ * @property {boolean=} strict
+ * @property {string=} moduleConcatenationBailout
  * @property {LazySet<string>=} fileDependencies
  * @property {LazySet<string>=} contextDependencies
  * @property {LazySet<string>=} missingDependencies

package/lib/ModuleFilenameHelpers.js

@@ -87,28 +87,6 @@ const getHash =
 		return digest.slice(0, 4);
 	};
 
-/**
- * Returns a function that returns the string with the token replaced with the replacement
- * @param {string|RegExp} test A regular expression string or Regular Expression object
- * @returns	{RegExp} A regular expression object
- * @example
- * ```js
- * const test = asRegExp("test");
- * test.test("test"); // true
- *
- * const test2 = asRegExp(/test/);
- * test2.test("test"); // true
- * ```
- */
-const asRegExp = test => {
-	if (typeof test === "string") {
-		// Escape special characters in the string to prevent them from being interpreted as special characters in a regular expression. Do this by
-		// adding a backslash before each special character
-		test = new RegExp(`^${test.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&")}`);
-	}
-	return test;
-};
-
 /**
  * @template T
  * Returns a lazy object. The object is lazy in the sense that the properties are
@@ -335,15 +313,19 @@ ModuleFilenameHelpers.replaceDuplicates = (array, fn, comparator) => {
  * ModuleFilenameHelpers.matchPart("foo.js", [/^baz/, /^bar/]); // false
  * ```
  */
-ModuleFilenameHelpers.matchPart = (str, test) => {
+const matchPart = (str, test) => {
 	if (!test) return true;
-
 	if (Array.isArray(test)) {
-		return test.map(asRegExp).some(regExp => regExp.test(str));
+		return test.some(test => matchPart(str, test));
 	}
-	return asRegExp(test).test(str);
+	if (typeof test === "string") {
+		return str.startsWith(test);
+	}
+	return test.test(str);
 };
 
+ModuleFilenameHelpers.matchPart = matchPart;
+
 /**
  * Tests if a string matches a match object. The match object can have the following properties:
  * - `test`: a RegExp or an array of RegExp

package/lib/asset/AssetModulesPlugin.js

@@ -12,7 +12,7 @@ const {
 	ASSET_MODULE_TYPE_SOURCE
 } = require("../ModuleTypeConstants");
 const { cleverMerge } = require("../util/cleverMerge");
-const { compareModulesByIdentifier } = require("../util/comparators");
+const { compareModulesByIdOrIdentifier } = require("../util/comparators");
 const createSchemaValidation = require("../util/create-schema-validation");
 const memoize = require("../util/memoize");
 
@@ -189,7 +189,7 @@ class AssetModulesPlugin {
 					const modules = chunkGraph.getOrderedChunkModulesIterableBySourceType(
 						chunk,
 						ASSET_MODULE_TYPE,
-						compareModulesByIdentifier
+						compareModulesByIdOrIdentifier(chunkGraph)
 					);
 					if (modules) {
 						for (const module of modules) {

package/lib/config/defaults.js

@@ -262,7 +262,8 @@ const applyWebpackOptionsDefaults = (options, compilerIndex) => {
 		futureDefaults,
 		isNode: targetProperties && targetProperties.node === true,
 		uniqueName: options.output.uniqueName,
-		targetProperties
+		targetProperties,
+		mode: options.mode
 	});
 
 	applyExternalsPresetsDefaults(options.externalsPresets, {
@@ -609,6 +610,7 @@ const applyCssGeneratorOptionsDefaults = (
  * @param {string} options.uniqueName the unique name
  * @param {boolean} options.isNode is node target platform
  * @param {TargetProperties | false} options.targetProperties target properties
+ * @param {Mode} options.mode mode
  * @returns {void}
  */
 const applyModuleDefaults = (
@@ -621,7 +623,8 @@ const applyModuleDefaults = (
 		futureDefaults,
 		isNode,
 		uniqueName,
-		targetProperties
+		targetProperties,
+		mode
 	}
 ) => {
 	if (cache) {
@@ -663,6 +666,12 @@ const applyModuleDefaults = (
 	}
 
 	F(module.parser, "javascript", () => ({}));
+	F(module.parser, JSON_MODULE_TYPE, () => ({}));
+	D(
+		module.parser[JSON_MODULE_TYPE],
+		"exportsDepth",
+		mode === "development" ? 1 : Infinity
+	);
 
 	applyJavascriptParserOptionsDefaults(
 		/** @type {NonNullable<ParserOptionsByModuleTypeKnown["javascript"]>} */
@@ -1075,7 +1084,7 @@ const applyOutputDefaults = (
 	D(output, "assetModuleFilename", "[hash][ext][query]");
 	D(output, "webassemblyModuleFilename", "[hash].module.wasm");
 	D(output, "compareBeforeEmit", true);
-	D(output, "charset", true);
+	D(output, "charset", !futureDefaults);
 	const uniqueNameId = Template.toIdentifier(
 		/** @type {NonNullable<Output["uniqueName"]>} */ (output.uniqueName)
 	);

package/lib/css/CssLoadingRuntimeModule.js

@@ -74,7 +74,8 @@ class CssLoadingRuntimeModule extends RuntimeModule {
 			outputOptions: {
 				crossOriginLoading,
 				uniqueName,
-				chunkLoadTimeout: loadTimeout
+				chunkLoadTimeout: loadTimeout,
+				charset
 			}
 		} = compilation;
 		const fn = RuntimeGlobals.ensureChunkHandlers;
@@ -138,6 +139,7 @@ class CssLoadingRuntimeModule extends RuntimeModule {
 
 		const code = Template.asString([
 			"link = document.createElement('link');",
+			charset ? "link.charset = 'utf-8';" : "",
 			`if (${RuntimeGlobals.scriptNonce}) {`,
 			Template.indent(
 				`link.setAttribute("nonce", ${RuntimeGlobals.scriptNonce});`
@@ -351,6 +353,7 @@ class CssLoadingRuntimeModule extends RuntimeModule {
 							linkPrefetch.call(
 								Template.asString([
 									"var link = document.createElement('link');",
+									charset ? "link.charset = 'utf-8';" : "",
 									crossOriginLoading
 										? `link.crossOrigin = ${JSON.stringify(
 												crossOriginLoading
@@ -390,7 +393,7 @@ class CssLoadingRuntimeModule extends RuntimeModule {
 							linkPreload.call(
 								Template.asString([
 									"var link = document.createElement('link');",
-									"link.charset = 'utf-8';",
+									charset ? "link.charset = 'utf-8';" : "",
 									`if (${RuntimeGlobals.scriptNonce}) {`,
 									Template.indent(
 										`link.setAttribute("nonce", ${RuntimeGlobals.scriptNonce});`

package/lib/css/CssModulesPlugin.js

@@ -36,7 +36,7 @@ const CssSelfLocalIdentifierDependency = require("../dependencies/CssSelfLocalId
 const CssUrlDependency = require("../dependencies/CssUrlDependency");
 const StaticExportsDependency = require("../dependencies/StaticExportsDependency");
 const JavascriptModulesPlugin = require("../javascript/JavascriptModulesPlugin");
-const { compareModulesByIdentifier } = require("../util/comparators");
+const { compareModulesByIdOrIdentifier } = require("../util/comparators");
 const createSchemaValidation = require("../util/create-schema-validation");
 const createHash = require("../util/createHash");
 const { getUndoPath } = require("../util/identifier");
@@ -598,6 +598,10 @@ class CssModulesPlugin {
 		if (modulesByChunkGroup.length === 1)
 			return modulesByChunkGroup[0].list.reverse();
 
+		const boundCompareModulesByIdOrIdentifier = compareModulesByIdOrIdentifier(
+			compilation.chunkGraph
+		);
+
 		/**
 		 * @param {{ list: Module[] }} a a
 		 * @param {{ list: Module[] }} b b
@@ -608,7 +612,10 @@ class CssModulesPlugin {
 				return b.length === 0 ? 0 : 1;
 			}
 			if (b.length === 0) return -1;
-			return compareModulesByIdentifier(a[a.length - 1], b[b.length - 1]);
+			return boundCompareModulesByIdOrIdentifier(
+				a[a.length - 1],
+				b[b.length - 1]
+			);
 		};
 
 		modulesByChunkGroup.sort(compareModuleLists);
@@ -690,7 +697,7 @@ class CssModulesPlugin {
 					chunkGraph.getOrderedChunkModulesIterableBySourceType(
 						chunk,
 						"css-import",
-						compareModulesByIdentifier
+						compareModulesByIdOrIdentifier(chunkGraph)
 					)
 				),
 				compilation
@@ -702,7 +709,7 @@ class CssModulesPlugin {
 					chunkGraph.getOrderedChunkModulesIterableBySourceType(
 						chunk,
 						"css",
-						compareModulesByIdentifier
+						compareModulesByIdOrIdentifier(chunkGraph)
 					)
 				),
 				compilation

package/lib/dependencies/CommonJsImportsParserPlugin.js

@@ -464,6 +464,36 @@ class CommonJsImportsParserPlugin {
 		 * @returns {boolean | void} true when handled
 		 */
 		const processResolve = (expr, weak) => {
+			if (!weak && options.commonjsMagicComments) {
+				const { options: requireOptions, errors: commentErrors } =
+					parser.parseCommentOptions(/** @type {Range} */ (expr.range));
+
+				if (commentErrors) {
+					for (const e of commentErrors) {
+						const { comment } = e;
+						parser.state.module.addWarning(
+							new CommentCompilationWarning(
+								`Compilation error while processing magic comment(-s): /*${comment.value}*/: ${e.message}`,
+								/** @type {DependencyLocation} */ (comment.loc)
+							)
+						);
+					}
+				}
+				if (requireOptions && requireOptions.webpackIgnore !== undefined) {
+					if (typeof requireOptions.webpackIgnore !== "boolean") {
+						parser.state.module.addWarning(
+							new UnsupportedFeatureWarning(
+								`\`webpackIgnore\` expected a boolean, but received: ${requireOptions.webpackIgnore}.`,
+								/** @type {DependencyLocation} */ (expr.loc)
+							)
+						);
+					} else if (requireOptions.webpackIgnore) {
+						// Do not instrument `require()` if `webpackIgnore` is `true`
+						return true;
+					}
+				}
+			}
+
 			if (expr.arguments.length !== 1) return;
 			const param = parser.evaluateExpression(expr.arguments[0]);
 			if (param.isConditional()) {

package/lib/dependencies/CssLocalIdentifierDependency.js

@@ -237,7 +237,7 @@ CssLocalIdentifierDependency.Template = class CssLocalIdentifierDependencyTempla
 		source.replace(dep.range[0], dep.range[1] - 1, identifier);
 
 		for (const used of usedNames.concat(names)) {
-			cssData.exports.set(used, identifier);
+			cssData.exports.set(used, getCssParser().unescapeIdentifier(identifier));
 		}
 	}
 };

package/lib/dependencies/JsonExportsDependency.js

@@ -20,40 +20,44 @@ const NullDependency = require("./NullDependency");
 /** @typedef {import("../util/Hash")} Hash */
 
 /**
- * @param {RawJsonData} data data
- * @returns {TODO} value
+ * @param {number} exportsDepth exportsDepth
+ * @returns {((data: RawJsonData, curDepth?: number) => ExportSpec[] | undefined)} value
  */
-const getExportsFromData = data => {
-	if (data && typeof data === "object") {
-		if (Array.isArray(data)) {
-			return data.length < 100
-				? data.map((item, idx) => ({
-						name: `${idx}`,
-						canMangle: true,
-						exports: getExportsFromData(item)
-					}))
-				: undefined;
+const getExportsWithDepth = exportsDepth =>
+	function getExportsFromData(data, curDepth = 1) {
+		if (curDepth > exportsDepth) return undefined;
+		if (data && typeof data === "object") {
+			if (Array.isArray(data)) {
+				return data.length < 100
+					? data.map((item, idx) => ({
+							name: `${idx}`,
+							canMangle: true,
+							exports: getExportsFromData(item, curDepth + 1)
+						}))
+					: undefined;
+			}
+			const exports = [];
+			for (const key of Object.keys(data)) {
+				exports.push({
+					name: key,
+					canMangle: true,
+					exports: getExportsFromData(data[key], curDepth + 1)
+				});
+			}
+			return exports;
 		}
-		const exports = [];
-		for (const key of Object.keys(data)) {
-			exports.push({
-				name: key,
-				canMangle: true,
-				exports: getExportsFromData(data[key])
-			});
-		}
-		return exports;
-	}
-	return undefined;
-};
+		return undefined;
+	};
 
 class JsonExportsDependency extends NullDependency {
 	/**
 	 * @param {JsonData} data json data
+	 * @param {number} exportsDepth the depth of json exports to analyze
 	 */
-	constructor(data) {
+	constructor(data, exportsDepth) {
 		super();
 		this.data = data;
+		this.exportsDepth = exportsDepth;
 	}
 
 	get type() {
@@ -67,7 +71,7 @@ class JsonExportsDependency extends NullDependency {
 	 */
 	getExports(moduleGraph) {
 		return {
-			exports: getExportsFromData(
+			exports: getExportsWithDepth(this.exportsDepth)(
 				this.data && /** @type {RawJsonData} */ (this.data.get())
 			),
 			dependencies: undefined
@@ -90,6 +94,7 @@ class JsonExportsDependency extends NullDependency {
 	serialize(context) {
 		const { write } = context;
 		write(this.data);
+		write(this.exportsDepth);
 		super.serialize(context);
 	}
 
@@ -99,6 +104,7 @@ class JsonExportsDependency extends NullDependency {
 	deserialize(context) {
 		const { read } = context;
 		this.data = read();
+		this.exportsDepth = read();
 		super.deserialize(context);
 	}
 }

package/lib/esm/ModuleChunkLoadingRuntimeModule.js

@@ -93,7 +93,7 @@ class ModuleChunkLoadingRuntimeModule extends RuntimeModule {
 			(compilation.outputOptions.environment);
 		const {
 			runtimeTemplate,
-			outputOptions: { importFunctionName, crossOriginLoading }
+			outputOptions: { importFunctionName, crossOriginLoading, charset }
 		} = compilation;
 		const fn = RuntimeGlobals.ensureChunkHandlers;
 		const withBaseURI = this._runtimeRequirements.has(RuntimeGlobals.baseURI);
@@ -261,6 +261,7 @@ class ModuleChunkLoadingRuntimeModule extends RuntimeModule {
 							linkPrefetch.call(
 								Template.asString([
 									"var link = document.createElement('link');",
+									charset ? "link.charset = 'utf-8';" : "",
 									crossOriginLoading
 										? `link.crossOrigin = ${JSON.stringify(
 												crossOriginLoading
@@ -300,7 +301,7 @@ class ModuleChunkLoadingRuntimeModule extends RuntimeModule {
 							linkPreload.call(
 								Template.asString([
 									"var link = document.createElement('link');",
-									"link.charset = 'utf-8';",
+									charset ? "link.charset = 'utf-8';" : "",
 									`if (${RuntimeGlobals.scriptNonce}) {`,
 									Template.indent(
 										`link.setAttribute("nonce", ${RuntimeGlobals.scriptNonce});`

package/lib/javascript/JavascriptModulesPlugin.js

@@ -30,7 +30,7 @@ const RuntimeGlobals = require("../RuntimeGlobals");
 const Template = require("../Template");
 const { last, someInIterable } = require("../util/IterableHelpers");
 const StringXor = require("../util/StringXor");
-const { compareModulesByIdentifier } = require("../util/comparators");
+const { compareModulesByIdOrIdentifier } = require("../util/comparators");
 const {
 	getPathInAst,
 	getAllReferences,
@@ -678,7 +678,7 @@ class JavascriptModulesPlugin {
 		const modules = chunkGraph.getOrderedChunkModulesIterableBySourceType(
 			chunk,
 			"javascript",
-			compareModulesByIdentifier
+			compareModulesByIdOrIdentifier(chunkGraph)
 		);
 		const allModules = modules ? Array.from(modules) : [];
 		let strictHeader;
@@ -757,7 +757,7 @@ class JavascriptModulesPlugin {
 			chunkGraph.getOrderedChunkModulesIterableBySourceType(
 				chunk,
 				"javascript",
-				compareModulesByIdentifier
+				compareModulesByIdOrIdentifier(chunkGraph)
 			) || []
 		);
 

package/lib/json/JsonModulesPlugin.js

@@ -42,7 +42,6 @@ class JsonModulesPlugin {
 					.for(JSON_MODULE_TYPE)
 					.tap(PLUGIN_NAME, parserOptions => {
 						validate(parserOptions);
-
 						return new JsonParser(parserOptions);
 					});
 				normalModuleFactory.hooks.createGenerator

package/lib/json/JsonParser.js

@@ -63,7 +63,9 @@ class JsonParser extends Parser {
 		buildMeta.exportsType = "default";
 		buildMeta.defaultObject =
 			typeof data === "object" ? "redirect-warn" : false;
-		state.module.addDependency(new JsonExportsDependency(jsonData));
+		state.module.addDependency(
+			new JsonExportsDependency(jsonData, this.options.exportsDepth)
+		);
 		return state;
 	}
 }

package/lib/optimize/SplitChunksPlugin.js

@@ -1743,6 +1743,9 @@ module.exports = class SplitChunksPlugin {
 								);
 								chunk.split(newPart);
 								newPart.chunkReason = chunk.chunkReason;
+								if (chunk.filenameTemplate) {
+									newPart.filenameTemplate = chunk.filenameTemplate;
+								}
 								// Add all modules to the new chunk
 								for (const module of group.items) {
 									if (!module.chunkCondition(newPart, compilation)) {

package/lib/runtime/AutoPublicPathRuntimeModule.js

@@ -72,7 +72,7 @@ class AutoPublicPathRuntimeModule extends RuntimeModule {
 			"// When supporting browsers where an automatic publicPath is not supported you must specify an output.publicPath manually via configuration",
 			'// or pass an empty string ("") and set the __webpack_public_path__ variable from your code to use your own logic.',
 			'if (!scriptUrl) throw new Error("Automatic publicPath is not supported in this browser");',
-			'scriptUrl = scriptUrl.replace(/#.*$/, "").replace(/\\?.*$/, "").replace(/\\/[^\\/]+$/, "/");',
+			'scriptUrl = scriptUrl.replace(/^blob:/, "").replace(/#.*$/, "").replace(/\\?.*$/, "").replace(/\\/[^\\/]+$/, "/");',
 			!undoPath
 				? `${RuntimeGlobals.publicPath} = scriptUrl;`
 				: `${RuntimeGlobals.publicPath} = scriptUrl + ${JSON.stringify(

package/lib/stats/DefaultStatsFactoryPlugin.js

@@ -1852,7 +1852,7 @@ const spaceLimited = (
 						// So it should always end up being smaller
 						const headerSize = group.filteredChildren ? 2 : 1;
 						const limited = spaceLimited(
-							/** @type {Children<T>} */ (group.children),
+							/** @type {Children<T>[]} */ (group.children),
 							maxGroupSize -
 								// we should use ceil to always feet in max
 								Math.ceil(oversize / groups.length) -

package/lib/util/semver.js

@@ -259,15 +259,25 @@ module.exports.parseRange = str => {
 		const items = str.split(/\s+-\s+/);
 
 		if (items.length === 1) {
-			const items =
-				/** @type {SemVerRangeItem[][]} */
-				(
-					str
-						.trim()
-						.split(/(?<=[-0-9A-Za-z])\s+/g)
-						.map(parseSimple)
-				);
+			str = str.trim();
 
+			/** @type {SemVerRangeItem[][]} */
+			const items = [];
+			const r = /[-0-9A-Za-z]\s+/g;
+			var start = 0;
+			var match;
+			while ((match = r.exec(str))) {
+				const end = match.index + 1;
+				items.push(
+					/** @type {SemVerRangeItem[]} */
+					(parseSimple(str.slice(start, end).trim()))
+				);
+				start = end;
+			}
+			items.push(
+				/** @type {SemVerRangeItem[]} */
+				(parseSimple(str.slice(start).trim()))
+			);
 			return combine(items, 2);
 		}
 

package/lib/validateSchema.js

@@ -87,7 +87,7 @@ const validateSchema = (schema, options, validationConfiguration) => {
 					children.some(
 						child =>
 							child.keyword === "absolutePath" &&
-							child.dataPath === ".output.filename"
+							child.instancePath === "/output/filename"
 					)
 				) {
 					return `${formattedError}\nPlease use output.path to specify absolute path and output.filename for the file name.`;
@@ -97,7 +97,7 @@ const validateSchema = (schema, options, validationConfiguration) => {
 					children &&
 					children.some(
 						child =>
-							child.keyword === "pattern" && child.dataPath === ".devtool"
+							child.keyword === "pattern" && child.instancePath === "/devtool"
 					)
 				) {
 					return (
@@ -108,10 +108,7 @@ const validateSchema = (schema, options, validationConfiguration) => {
 				}
 
 				if (error.keyword === "additionalProperties") {
-					const params =
-						/** @type {import("ajv").AdditionalPropertiesParams} */ (
-							error.params
-						);
+					const params = error.params;
 					if (
 						Object.prototype.hasOwnProperty.call(
 							DID_YOU_MEAN,
@@ -136,7 +133,7 @@ const validateSchema = (schema, options, validationConfiguration) => {
 						}?`;
 					}
 
-					if (!error.dataPath) {
+					if (!error.instancePath) {
 						if (params.additionalProperty === "debug") {
 							return (
 								`${formattedError}\n` +

package/lib/wasm/EnableWasmLoadingPlugin.js

@@ -99,7 +99,7 @@ class EnableWasmLoadingPlugin {
 						new ReadFileCompileWasmPlugin({
 							mangleImports: compiler.options.optimization.mangleWasmImports,
 							import:
-								compiler.options.output.environment.module &&
+								compiler.options.output.module &&
 								compiler.options.output.environment.dynamicImport
 						}).apply(compiler);
 					}
@@ -108,7 +108,7 @@ class EnableWasmLoadingPlugin {
 						const ReadFileCompileAsyncWasmPlugin = require("../node/ReadFileCompileAsyncWasmPlugin");
 						new ReadFileCompileAsyncWasmPlugin({
 							import:
-								compiler.options.output.environment.module &&
+								compiler.options.output.module &&
 								compiler.options.output.environment.dynamicImport
 						}).apply(compiler);
 					}

package/lib/wasm-async/AsyncWebAssemblyModulesPlugin.js

@@ -11,7 +11,7 @@ const Generator = require("../Generator");
 const { tryRunOrWebpackError } = require("../HookWebpackError");
 const { WEBASSEMBLY_MODULE_TYPE_ASYNC } = require("../ModuleTypeConstants");
 const WebAssemblyImportDependency = require("../dependencies/WebAssemblyImportDependency");
-const { compareModulesByIdentifier } = require("../util/comparators");
+const { compareModulesByIdOrIdentifier } = require("../util/comparators");
 const memoize = require("../util/memoize");
 
 /** @typedef {import("webpack-sources").Source} Source */
@@ -146,7 +146,7 @@ class AsyncWebAssemblyModulesPlugin {
 
 						for (const module of chunkGraph.getOrderedChunkModulesIterable(
 							chunk,
-							compareModulesByIdentifier
+							compareModulesByIdOrIdentifier(chunkGraph)
 						)) {
 							if (module.type === WEBASSEMBLY_MODULE_TYPE_ASYNC) {
 								const filenameTemplate =

package/lib/wasm-sync/WebAssemblyModulesPlugin.js

@@ -9,7 +9,7 @@ const Generator = require("../Generator");
 const { WEBASSEMBLY_MODULE_TYPE_SYNC } = require("../ModuleTypeConstants");
 const WebAssemblyExportImportedDependency = require("../dependencies/WebAssemblyExportImportedDependency");
 const WebAssemblyImportDependency = require("../dependencies/WebAssemblyImportDependency");
-const { compareModulesByIdentifier } = require("../util/comparators");
+const { compareModulesByIdOrIdentifier } = require("../util/comparators");
 const memoize = require("../util/memoize");
 const WebAssemblyInInitialChunkError = require("./WebAssemblyInInitialChunkError");
 
@@ -89,7 +89,7 @@ class WebAssemblyModulesPlugin {
 
 					for (const module of chunkGraph.getOrderedChunkModulesIterable(
 						chunk,
-						compareModulesByIdentifier
+						compareModulesByIdOrIdentifier(chunkGraph)
 					)) {
 						if (module.type === WEBASSEMBLY_MODULE_TYPE_SYNC) {
 							const filenameTemplate =