webpack 5.106.2 → 5.107.1

package/lib/EvalSourceMapDevToolPlugin.js

@@ -23,7 +23,6 @@ const { makePathsAbsolute } = require("./util/identifier");
 /** @typedef {import("../declarations/plugins/SourceMapDevToolPlugin").Rules} Rules */
 /** @typedef {import("./Compiler")} Compiler */
 /** @typedef {import("./ChunkGraph").ModuleId} ModuleId */
-/** @typedef {import("./TemplatedPathPlugin").TemplatePath} TemplatePath */
 
 /** @type {WeakMap<Source, Source>} */
 const cache = new WeakMap();
@@ -103,17 +102,12 @@ class EvalSourceMapDevToolPlugin {
 					};
 
 					if (m instanceof NormalModule) {
-						const module = /** @type {NormalModule} */ (m);
-						if (!matchModule(module.resource)) {
+						if (!matchModule(m.resource)) {
 							return result(source);
 						}
 					} else if (m instanceof ConcatenatedModule) {
-						const concatModule = /** @type {ConcatenatedModule} */ (m);
-						if (concatModule.rootModule instanceof NormalModule) {
-							const module = /** @type {NormalModule} */ (
-								concatModule.rootModule
-							);
-							if (!matchModule(module.resource)) {
+						if (m.rootModule instanceof NormalModule) {
+							if (!matchModule(m.rootModule.resource)) {
 								return result(source);
 							}
 						} else {
@@ -146,9 +140,13 @@ class EvalSourceMapDevToolPlugin {
 					sourceMap = { ...sourceMap };
 					const context = compiler.context;
 					const root = compiler.root;
+					const cachedAbsolutify = makePathsAbsolute.bindContextCache(
+						context,
+						root
+					);
 					const modules = sourceMap.sources.map((source) => {
 						if (!source.startsWith("webpack://")) return source;
-						source = makePathsAbsolute(context, source.slice(10), root);
+						source = cachedAbsolutify(source.slice(10));
 						const module = compilation.findModule(source);
 						return module || source;
 					});

package/lib/ExportsInfo.js

@@ -114,6 +114,21 @@ class ExportsInfo {
 	constructor() {
 		/** @type {Exports} */
 		this._exports = new Map();
+
+		// `_otherExportsInfo` is a fallback entry for unlisted exports. Two roles:
+		// 1. factory template — `getExportInfo` creates `new ExportInfo(name, this)`,
+		//    so created export info extends its properties.
+		// 2. flags whether the whole exportsInfo can be statically analyzed.
+		// Its `used` reachable values:
+		// 	- NoInfo: no use analysis yet (`optimization#usedExports` off), or used without info
+		// 	- Unused: analyzed, no unlisted export needed
+		// 	- Unknown: used in unknown way
+		// 	- Used/OnlyPropertiesUsed: never reached
+		// Its `provided` reachable values:
+		// 	- undefined: provision not determined yet
+		// 	- false: determined, no unlisted export is provided
+		// 	- null: only runtime knows (dynamic/unknown exports)
+		// 	- true: never reached
 		/** @type {ExportInfo} */
 		this._otherExportsInfo = new ExportInfo(null);
 		/** @type {ExportInfo} */
@@ -239,22 +254,12 @@ class ExportsInfo {
 
 	setHasProvideInfo() {
 		for (const exportInfo of this._exports.values()) {
-			if (exportInfo.provided === undefined) {
-				exportInfo.provided = false;
-			}
-			if (exportInfo.canMangleProvide === undefined) {
-				exportInfo.canMangleProvide = true;
-			}
+			exportInfo.setHasProvideInfo();
 		}
 		if (this._redirectTo !== undefined) {
 			this._redirectTo.setHasProvideInfo();
 		} else {
-			if (this._otherExportsInfo.provided === undefined) {
-				this._otherExportsInfo.provided = false;
-			}
-			if (this._otherExportsInfo.canMangleProvide === undefined) {
-				this._otherExportsInfo.canMangleProvide = true;
-			}
+			this._otherExportsInfo.setHasProvideInfo();
 		}
 	}
 
@@ -436,20 +441,8 @@ class ExportsInfo {
 			if (this._redirectTo.setUsedInUnknownWay(runtime)) {
 				changed = true;
 			}
-		} else {
-			if (
-				this._otherExportsInfo.setUsedConditionally(
-					(used) => used < UsageState.Unknown,
-					UsageState.Unknown,
-					runtime
-				)
-			) {
-				changed = true;
-			}
-			if (this._otherExportsInfo.canMangleUse !== false) {
-				this._otherExportsInfo.canMangleUse = false;
-				changed = true;
-			}
+		} else if (this._otherExportsInfo.setUsedInUnknownWay(runtime)) {
+			changed = true;
 		}
 		return changed;
 	}
@@ -470,14 +463,8 @@ class ExportsInfo {
 			if (this._redirectTo.setUsedWithoutInfo(runtime)) {
 				changed = true;
 			}
-		} else {
-			if (this._otherExportsInfo.setUsed(UsageState.NoInfo, runtime)) {
-				changed = true;
-			}
-			if (this._otherExportsInfo.canMangleUse !== false) {
-				this._otherExportsInfo.canMangleUse = false;
-				changed = true;
-			}
+		} else if (this._otherExportsInfo.setUsedWithoutInfo(runtime)) {
+			changed = true;
 		}
 		return changed;
 	}
@@ -1030,6 +1017,15 @@ class ExportInfo {
 		return changed;
 	}
 
+	setHasProvideInfo() {
+		if (this.provided === undefined) {
+			this.provided = false;
+		}
+		if (this.canMangleProvide === undefined) {
+			this.canMangleProvide = true;
+		}
+	}
+
 	setHasUseInfo() {
 		if (!this._hasUseInRuntimeInfo) {
 			this._hasUseInRuntimeInfo = true;

package/lib/ExternalModule.js

@@ -8,13 +8,13 @@
 const { SyncBailHook } = require("tapable");
 const { OriginalSource, RawSource } = require("webpack-sources");
 const ConcatenationScope = require("./ConcatenationScope");
-const EnvironmentNotSupportAsyncWarning = require("./EnvironmentNotSupportAsyncWarning");
 const { UsageState } = require("./ExportsInfo");
 const InitFragment = require("./InitFragment");
 const Module = require("./Module");
 const {
+	ASSET_URL_TYPE,
+	ASSET_URL_TYPES,
 	CSS_IMPORT_TYPES,
-	CSS_URL_TYPES,
 	JAVASCRIPT_TYPE,
 	JAVASCRIPT_TYPES
 } = require("./ModuleSourceTypeConstants");
@@ -22,7 +22,9 @@ const { JAVASCRIPT_MODULE_TYPE_DYNAMIC } = require("./ModuleTypeConstants");
 const RuntimeGlobals = require("./RuntimeGlobals");
 const Template = require("./Template");
 const { DEFAULTS } = require("./config/defaults");
+const { ImportPhaseUtils } = require("./dependencies/ImportPhase");
 const StaticExportsDependency = require("./dependencies/StaticExportsDependency");
+const EnvironmentNotSupportAsyncWarning = require("./errors/EnvironmentNotSupportAsyncWarning");
 const createHash = require("./util/createHash");
 const extractUrlAndGlobal = require("./util/extractUrlAndGlobal");
 const makeSerializable = require("./util/makeSerializable");
@@ -62,15 +64,16 @@ const { register } = require("./util/serialization");
 /** @typedef {import("./RuntimeTemplate")} RuntimeTemplate */
 /** @typedef {import("./javascript/JavascriptModulesPlugin").ChunkRenderContext} ChunkRenderContext */
 /** @typedef {import("./javascript/JavascriptParser").ImportAttributes} ImportAttributes */
+/** @typedef {import("./dependencies/ImportPhase").ImportPhaseType} ImportPhaseType */
 /** @typedef {import("./serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
 /** @typedef {import("./serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */
 /** @typedef {import("./util/Hash")} Hash */
 /** @typedef {import("./util/fs").InputFileSystem} InputFileSystem */
 /** @typedef {import("./util/runtime").RuntimeSpec} RuntimeSpec */
 
-/** @typedef {{ attributes?: ImportAttributes, externalType: "import" | "module" | undefined }} ImportDependencyMeta */
+/** @typedef {{ attributes?: ImportAttributes, phase?: ImportPhaseType, externalType: "import" | "module" | undefined }} ImportDependencyMeta */
 /** @typedef {{ layer?: string, supports?: string, media?: string }} CssImportDependencyMeta */
-/** @typedef {{ sourceType: "css-url" }} AssetDependencyMeta */
+/** @typedef {{ sourceType: "asset-url" | "css-url" }} AssetDependencyMeta */
 
 /** @typedef {ImportDependencyMeta | CssImportDependencyMeta | AssetDependencyMeta} DependencyMeta */
 
@@ -202,15 +205,25 @@ const getSourceForImportExternal = (
 	runtimeTemplate,
 	dependencyMeta
 ) => {
-	const importName = runtimeTemplate.outputOptions.importFunctionName;
+	const baseImportName = runtimeTemplate.outputOptions.importFunctionName;
 	if (
 		!runtimeTemplate.supportsDynamicImport() &&
-		(importName === "import" || importName === "module-import")
+		(baseImportName === "import" || baseImportName === "module-import")
 	) {
 		throw new Error(
 			"The target environment doesn't support 'import()' so it's not possible to use external type 'import'"
 		);
 	}
+	const phase = dependencyMeta && dependencyMeta.phase;
+	// `import.defer(…)` and `import.source(…)` are only valid forms of the
+	// native `import(…)` function, so we only emit the phase suffix when the
+	// importFunctionName is the default `"import"`.
+	const importName =
+		baseImportName === "import" && ImportPhaseUtils.isDefer(phase)
+			? "import.defer"
+			: baseImportName === "import" && ImportPhaseUtils.isSource(phase)
+				? "import.source"
+				: baseImportName;
 	const attributes =
 		dependencyMeta && dependencyMeta.attributes
 			? dependencyMeta.attributes._isLegacyAssert
@@ -293,7 +306,9 @@ class ModuleExternalInitFragment extends InitFragment {
 			"",
 			InitFragment.STAGE_HARMONY_IMPORTS,
 			0,
-			`external module import ${ident} ${imported === true ? imported : imported.join(" ")}`
+			`external module import ${ident} ${
+				imported === true ? imported : imported.join(" ")
+			}`
 		);
 		this._ident = ident;
 		this._request = request;
@@ -332,23 +347,34 @@ class ModuleExternalInitFragment extends InitFragment {
 		} = this;
 		const attributes =
 			dependencyMeta && dependencyMeta.attributes
-				? dependencyMeta.attributes._isLegacyAssert &&
-					dependencyMeta.attributes._isLegacyAssert
+				? dependencyMeta.attributes._isLegacyAssert
 					? ` assert ${JSON.stringify(
 							dependencyMeta.attributes,
 							importAssertionReplacer
 						)}`
 					: ` with ${JSON.stringify(dependencyMeta.attributes)}`
 				: "";
+		const phase = dependencyMeta && dependencyMeta.phase;
 		let content = "";
 		if (imported === true) {
 			// namespace
-			content = `import * as ${identifier} from ${JSON.stringify(request)}${
-				attributes
-			};\n`;
+			const phaseKeyword = ImportPhaseUtils.isDefer(phase) ? "defer " : "";
+			content = `import ${phaseKeyword}* as ${identifier} from ${JSON.stringify(
+				request
+			)}${attributes};\n`;
 		} else if (imported.length === 0) {
 			// just import, no use
 			content = `import ${JSON.stringify(request)}${attributes};\n`;
+		} else if (
+			ImportPhaseUtils.isSource(phase) &&
+			imported.length === 1 &&
+			imported[0][0] === "default"
+		) {
+			// `import source x from "…"` — the source-phase form binds the source
+			// object directly to a single identifier (no namespace, no destructuring).
+			content = `import source ${imported[0][1]} from ${JSON.stringify(
+				request
+			)}${attributes};\n`;
 		} else {
 			content = `import { ${imported
 				.map(([name, finalName]) => {
@@ -469,6 +495,7 @@ const getSourceForModuleExternal = (
 	dependencyMeta,
 	concatenationScope
 ) => {
+	const phase = dependencyMeta && dependencyMeta.phase;
 	/** @type {Imported} */
 	let imported = true;
 	if (concatenationScope) {
@@ -497,6 +524,14 @@ const getSourceForModuleExternal = (
 		imported = true;
 	}
 
+	// `import defer …` is only valid as `import defer * as ns from "…"`, so
+	// keep the namespace form even if usage analysis would otherwise narrow
+	// the import down to specific names. Defer + concatenation is semantically
+	// at odds (lazy vs. eager), so we preserve the user-written shape here.
+	if (ImportPhaseUtils.isDefer(phase)) {
+		imported = true;
+	}
+
 	const initFragment = new ModuleExternalInitFragment(
 		moduleAndSpecifiers[0],
 		imported,
@@ -702,13 +737,14 @@ class ExternalModule extends Module {
 	 * @returns {SourceTypes} types available (do not mutate)
 	 */
 	getSourceTypes() {
-		if (
-			this.externalType === "asset" &&
-			this.dependencyMeta &&
-			/** @type {AssetDependencyMeta} */
-			(this.dependencyMeta).sourceType === "css-url"
-		) {
-			return CSS_URL_TYPES;
+		if (this.externalType === "asset" && this.dependencyMeta) {
+			const sourceType =
+				/** @type {AssetDependencyMeta} */
+				(this.dependencyMeta).sourceType;
+			// TODO webpack 6 drop "css-url" once the alias is removed
+			if (sourceType === ASSET_URL_TYPE || sourceType === "css-url") {
+				return ASSET_URL_TYPES;
+			}
 		} else if (this.externalType === "css-import") {
 			return CSS_IMPORT_TYPES;
 		}
@@ -751,7 +787,21 @@ class ExternalModule extends Module {
 	 * @returns {string} a unique identifier of the module
 	 */
 	identifier() {
-		return `external ${this._resolveExternalType(this.externalType)} ${JSON.stringify(this.request)}`;
+		let id = `external ${this._resolveExternalType(
+			this.externalType
+		)} ${JSON.stringify(this.request)}`;
+		const meta = /** @type {ImportDependencyMeta | undefined} */ (
+			this.dependencyMeta
+		);
+		if (meta) {
+			if (meta.phase) {
+				id += `|phase=${ImportPhaseUtils.stringify(meta.phase)}`;
+			}
+			if (meta.attributes) {
+				id += `|attributes=${JSON.stringify(meta.attributes)}`;
+			}
+		}
+		return id;
 	}
 
 	/**
@@ -1065,12 +1115,14 @@ class ExternalModule extends Module {
 				data.set("url", { javascript: /** @type {string} */ (request) });
 				return { sources, runtimeRequirements: RUNTIME_REQUIREMENTS, data };
 			}
-			case "css-url": {
+			// TODO webpack 6 remove "css-url" alias
+			case "css-url":
+			case "asset-url": {
 				/** @type {Sources} */
 				const sources = new Map();
 				/** @type {CodeGenerationResultData} */
 				const data = new Map();
-				data.set("url", { "css-url": /** @type {string} */ (request) });
+				data.set("url", { [ASSET_URL_TYPE]: /** @type {string} */ (request) });
 				return { sources, runtimeRequirements: RUNTIME_REQUIREMENTS, data };
 			}
 			case "css-import": {
@@ -1126,7 +1178,9 @@ class ExternalModule extends Module {
 						scope.registerRawExport(specifier, finalName);
 					}
 				} else if (concatenationScope) {
-					sourceString = `${runtimeTemplate.renderConst()} ${ConcatenationScope.NAMESPACE_OBJECT_EXPORT} = ${sourceString};`;
+					sourceString = `${runtimeTemplate.renderConst()} ${
+						ConcatenationScope.NAMESPACE_OBJECT_EXPORT
+					} = ${sourceString};`;
 					concatenationScope.registerNamespaceExport(
 						ConcatenationScope.NAMESPACE_OBJECT_EXPORT
 					);
@@ -1194,10 +1248,21 @@ class ExternalModule extends Module {
 	updateHash(hash, context) {
 		const { chunkGraph } = context;
 		hash.update(
-			`${this._resolveExternalType(this.externalType)}${JSON.stringify(this.request)}${this.isOptional(
-				chunkGraph.moduleGraph
-			)}`
+			`${this._resolveExternalType(this.externalType)}${JSON.stringify(
+				this.request
+			)}${this.isOptional(chunkGraph.moduleGraph)}`
 		);
+		const meta = /** @type {ImportDependencyMeta | undefined} */ (
+			this.dependencyMeta
+		);
+		if (meta) {
+			if (meta.phase) {
+				hash.update(`|phase=${ImportPhaseUtils.stringify(meta.phase)}`);
+			}
+			if (meta.attributes) {
+				hash.update(`|attributes=${JSON.stringify(meta.attributes)}`);
+			}
+		}
 		super.updateHash(hash, context);
 	}
 

package/lib/ExternalModuleFactoryPlugin.js

@@ -7,6 +7,7 @@
 
 const util = require("util");
 const ExternalModule = require("./ExternalModule");
+const { ASSET_URL_TYPE } = require("./ModuleSourceTypeConstants");
 const ContextElementDependency = require("./dependencies/ContextElementDependency");
 const CssImportDependency = require("./dependencies/CssImportDependency");
 const CssUrlDependency = require("./dependencies/CssUrlDependency");
@@ -193,6 +194,11 @@ class ExternalModuleFactoryPlugin {
 
 						dependencyMeta = {
 							attributes: dependency.attributes,
+							phase:
+								dependency instanceof HarmonyImportDependency ||
+								dependency instanceof ImportDependency
+									? dependency.phase
+									: undefined,
 							externalType
 						};
 					} else if (dependency instanceof CssImportDependency) {
@@ -207,7 +213,7 @@ class ExternalModuleFactoryPlugin {
 						resolvedType === "asset" &&
 						dependency instanceof CssUrlDependency
 					) {
-						dependencyMeta = { sourceType: "css-url" };
+						dependencyMeta = { sourceType: ASSET_URL_TYPE };
 					}
 
 					callback(