webpack 5.107.1 → 5.108.0

package/lib/FlagDependencyUsagePlugin.js

@@ -21,7 +21,11 @@ const { getEntryRuntime, mergeRuntimeOwned } = require("./util/runtime");
 /** @typedef {import("./Module")} Module */
 /** @typedef {import("./util/runtime").RuntimeSpec} RuntimeSpec */
 
-const { NO_EXPORTS_REFERENCED, EXPORTS_OBJECT_REFERENCED } = Dependency;
+const {
+	NO_EXPORTS_REFERENCED,
+	EXPORTS_OBJECT_REFERENCED,
+	EXPORTS_OBJECT_REFERENCED_MANGLEABLE
+} = Dependency;
 
 const PLUGIN_NAME = "FlagDependencyUsagePlugin";
 const PLUGIN_LOGGER_NAME = `webpack.${PLUGIN_NAME}`;
@@ -30,10 +34,13 @@ class FlagDependencyUsagePlugin {
 	/**
 	 * Creates an instance of FlagDependencyUsagePlugin.
 	 * @param {boolean} global do a global analysis instead of per runtime
+	 * @param {boolean=} mangleEscapingNamespaces keep exports mangleable when a module's namespace object escapes
 	 */
-	constructor(global) {
+	constructor(global, mangleEscapingNamespaces = false) {
 		/** @type {boolean} */
 		this.global = global;
+		/** @type {boolean} */
+		this.mangleEscapingNamespaces = mangleEscapingNamespaces;
 	}
 
 	/**
@@ -75,6 +82,42 @@ class FlagDependencyUsagePlugin {
 						forceSideEffects
 					) => {
 						const exportsInfo = moduleGraph.getExportsInfo(module);
+						if (usedExports === EXPORTS_OBJECT_REFERENCED_MANGLEABLE) {
+							// The whole namespace object escapes via a reference that codegen
+							// can materialize as a decoupled namespace object. When all exports
+							// are statically known we keep them mangleable instead of marking
+							// them used-in-unknown-way.
+							if (
+								this.mangleEscapingNamespaces &&
+								module.buildMeta &&
+								module.buildMeta.exportsType === "namespace" &&
+								exportsInfo.otherExportsInfo.provided === false
+							) {
+								let changed = exportsInfo.setAllKnownExportsUsed(runtime);
+								// The whole namespace object is observed as a value, so the
+								// module must stay a real ES module namespace at runtime
+								// (keep __esModule / the namespace object, i.e. `r()`).
+								if (
+									exportsInfo
+										.getExportInfo("__esModule")
+										.setUsed(UsageState.Used, runtime)
+								) {
+									changed = true;
+								}
+								// Exports must keep a real binding (not be inlined) so member
+								// access on the namespace has ES namespace semantics, e.g.
+								// `delete ns.x` hits a non-configurable property and throws.
+								for (const exportInfo of exportsInfo.ownedExports) {
+									exportInfo.canInlineUse = false;
+								}
+								if (changed) {
+									queue.enqueue(module, runtime);
+								}
+							} else if (exportsInfo.setUsedInUnknownWay(runtime)) {
+								queue.enqueue(module, runtime);
+							}
+							return;
+						}
 						if (usedExports.length > 0) {
 							if (!module.buildMeta || !module.buildMeta.exportsType) {
 								if (exportsInfo.setUsedWithoutInfo(runtime)) {
@@ -86,11 +129,13 @@ class FlagDependencyUsagePlugin {
 								/** @type {string[]} */
 								let usedExport;
 								let canMangle = true;
+								let canInline = true;
 								if (Array.isArray(usedExportInfo)) {
 									usedExport = usedExportInfo;
 								} else {
 									usedExport = usedExportInfo.name;
 									canMangle = usedExportInfo.canMangle !== false;
+									canInline = usedExportInfo.canInline !== false;
 								}
 								if (usedExport.length === 0) {
 									if (exportsInfo.setUsedInUnknownWay(runtime)) {
@@ -105,6 +150,12 @@ class FlagDependencyUsagePlugin {
 										if (canMangle === false) {
 											exportInfo.canMangleUse = false;
 										}
+
+										if (exportInfo.canInlineUse === undefined) {
+											exportInfo.canInlineUse = canInline;
+										} else if (!canInline) {
+											exportInfo.canInlineUse = false;
+										}
 										const lastOne = i === usedExport.length - 1;
 										if (!lastOne) {
 											const nestedInfo = exportInfo.getNestedExportsInfo();
@@ -175,6 +226,11 @@ class FlagDependencyUsagePlugin {
 						/** @typedef {Map<string, string[] | ReferencedExport>} ExportMaps */
 						/** @type {Map<Module, ReferencedExports | ExportMaps>} */
 						const map = new Map();
+						// Modules whose whole namespace object escapes in a mangleable way.
+						// Tracked separately so specific member references are still merged
+						// (and marked used) instead of being dropped by the escape marker.
+						/** @type {Set<Module>} */
+						const mangleableEscapeModules = new Set();
 
 						/** @type {ArrayQueue<DependenciesBlock>} */
 						const queue = new ArrayQueue();
@@ -213,10 +269,27 @@ class FlagDependencyUsagePlugin {
 								}
 								const referencedExports =
 									compilation.getDependencyReferencedExports(dep, runtime);
+								// The non-mangleable whole-object reference is the most
+								// conservative result and always wins.
+								if (referencedExports === EXPORTS_OBJECT_REFERENCED) {
+									map.set(module, EXPORTS_OBJECT_REFERENCED);
+									mangleableEscapeModules.delete(module);
+									continue;
+								}
+								// A mangleable whole-object escape keeps the module's exports
+								// mangleable (applied after the merge). Unlike the conservative
+								// marker it must not drop specific member references: those still
+								// need their own (possibly non-existent) export marked used so
+								// they render as a qualified access, not a bare `undefined`.
+								if (
+									referencedExports === EXPORTS_OBJECT_REFERENCED_MANGLEABLE
+								) {
+									mangleableEscapeModules.add(module);
+									continue;
+								}
 								if (
 									oldReferencedExports === undefined ||
-									oldReferencedExports === NO_EXPORTS_REFERENCED ||
-									referencedExports === EXPORTS_OBJECT_REFERENCED
+									oldReferencedExports === NO_EXPORTS_REFERENCED
 								) {
 									map.set(module, referencedExports);
 								} else if (
@@ -258,7 +331,8 @@ class FlagDependencyUsagePlugin {
 											} else {
 												exportsMap.set(key, {
 													name: item.name,
-													canMangle: item.canMangle && oldItem.canMangle
+													canMangle: item.canMangle && oldItem.canMangle,
+													canInline: item.canInline && oldItem.canInline
 												});
 											}
 										}
@@ -284,6 +358,14 @@ class FlagDependencyUsagePlugin {
 								);
 							}
 						}
+						for (const module of mangleableEscapeModules) {
+							processReferencedModule(
+								module,
+								EXPORTS_OBJECT_REFERENCED_MANGLEABLE,
+								runtime,
+								forceSideEffects
+							);
+						}
 					};
 
 					logger.time("initialize exports usage");

package/lib/FlagEntryExportAsUsedPlugin.js

@@ -18,7 +18,9 @@ class FlagEntryExportAsUsedPlugin {
 	 * @param {string} explanation explanation for the reason
 	 */
 	constructor(nsObjectUsed, explanation) {
+		/** @type {boolean} */
 		this.nsObjectUsed = nsObjectUsed;
+		/** @type {string} */
 		this.explanation = explanation;
 	}
 

package/lib/Generator.js

@@ -79,6 +79,13 @@ class Generator {
 		throw new AbstractMethodError();
 	}
 
+	/**
+	 * @returns {boolean} whether getTypes() depends on the module's incoming connections
+	 */
+	getTypesDependOnIncomingConnections() {
+		return false;
+	}
+
 	/* istanbul ignore next */
 	/**
 	 * Returns the estimated size for the requested source type.
@@ -156,6 +163,7 @@ class ByTypeGenerator extends Generator {
 	constructor(map) {
 		super();
 		this.map = map;
+		/** @type {SourceTypes} */
 		this._types = /** @type {SourceTypes} */ (new Set(Object.keys(map)));
 		/** @type {GenerateErrorFn | undefined} */
 		this.generateError = generateError.bind(this);

package/lib/HotModuleReplacementPlugin.js

@@ -56,6 +56,7 @@ const {
 /** @typedef {import("./Dependency").DependencyLocation} DependencyLocation */
 /** @typedef {import("./Module")} Module */
 /** @typedef {import("./Module").BuildInfo} BuildInfo */
+/** @typedef {import("./css/CssModule").CssModuleBuildMeta} CssModuleBuildMeta */
 /** @typedef {import("./RuntimeModule")} RuntimeModule */
 /** @typedef {import("./javascript/BasicEvaluatedExpression")} BasicEvaluatedExpression */
 /** @typedef {import("./javascript/JavascriptParserHelpers").Range} Range */
@@ -80,7 +81,7 @@ const {
 /** @typedef {Set<ChunkId>} ChunkIds */
 /** @typedef {Set<Module>} ModuleSet */
 
-/** @typedef {{ updatedChunkIds: ChunkIds, removedChunkIds: ChunkIds, removedModules: ModuleSet, filename: string, assetInfo: AssetInfo }} HotUpdateMainContentByRuntimeItem */
+/** @typedef {{ updatedChunkIds: ChunkIds, removedChunkIds: ChunkIds, removedModules: ModuleSet, forceLoadChunkIds: ChunkIds, filename: string, assetInfo: AssetInfo }} HotUpdateMainContentByRuntimeItem */
 /** @typedef {Map<string, HotUpdateMainContentByRuntimeItem>} HotUpdateMainContentByRuntime */
 
 /** @type {WeakMap<JavascriptParser, HMRJavascriptParserHooks>} */
@@ -167,10 +168,10 @@ class HotModuleReplacementPlugin {
 								/** @type {Range} */ (param.range)
 							);
 							dep.optional = true;
-							dep.loc = Object.create(
-								/** @type {DependencyLocation} */ (expr.loc)
+							dep.setLocWithIndex(
+								/** @type {DependencyLocation} */ (expr.loc),
+								idx
 							);
-							dep.loc.index = idx;
 							module.addDependency(dep);
 							requests.push(request);
 						}
@@ -224,8 +225,10 @@ class HotModuleReplacementPlugin {
 						/** @type {Range} */ (param.range)
 					);
 					dep.optional = true;
-					dep.loc = Object.create(/** @type {DependencyLocation} */ (expr.loc));
-					dep.loc.index = idx;
+					dep.setLocWithIndex(
+						/** @type {DependencyLocation} */ (expr.loc),
+						idx
+					);
 					module.addDependency(dep);
 				}
 			}
@@ -403,7 +406,8 @@ class HotModuleReplacementPlugin {
 								for (const innerModule of m.modules) {
 									if (
 										innerModule.buildMeta &&
-										innerModule.buildMeta.needIdInConcatenation
+										/** @type {CssModuleBuildMeta} */ (innerModule.buildMeta)
+											.needIdInConcatenation
 									) {
 										const innerId = chunkGraph.getModuleId(innerModule);
 										if (innerId !== null) {
@@ -573,6 +577,8 @@ class HotModuleReplacementPlugin {
 									removedChunkIds: new Set(),
 									/** @type {ModuleSet} */
 									removedModules: new Set(),
+									/** @type {ChunkIds} */
+									forceLoadChunkIds: new Set(),
 									filename,
 									assetInfo
 								}
@@ -699,30 +705,43 @@ class HotModuleReplacementPlugin {
 										}
 									} else {
 										// module is no longer in this runtime combination
-										// We (incorrectly) assume that it's not in an overlapping runtime combination
-										// and dispose it from the main runtimes the chunk was removed from
 										forEachRuntime(removedFromRuntime, (runtime) => {
-											// If the module is still used in this runtime, do not dispose it
-											// This could create a bad runtime state where the module is still loaded,
-											// but no chunk which contains it. This means we don't receive further HMR updates
-											// to this module and that's bad.
-											// TODO force load one of the chunks which contains the module
-											for (const moduleRuntime of runtimes) {
-												if (typeof moduleRuntime === "string") {
-													if (moduleRuntime === runtime) return;
-												} else if (
-													moduleRuntime !== undefined &&
-													moduleRuntime.has(/** @type {string} */ (runtime))
-												) {
-													return;
-												}
-											}
 											const item =
 												/** @type {HotUpdateMainContentByRuntimeItem} */ (
 													hotUpdateMainContentByRuntime.get(
 														/** @type {string} */ (runtime)
 													)
 												);
+											// Module still in this runtime via another chunk: force-load one so
+											// it keeps an installed owner instead of being disposed (lost updates).
+											const stillInRuntime = [...runtimes].some(
+												(moduleRuntime) =>
+													typeof moduleRuntime === "string"
+														? moduleRuntime === runtime
+														: moduleRuntime !== undefined &&
+															moduleRuntime.has(/** @type {string} */ (runtime))
+											);
+											if (stillInRuntime) {
+												for (const moduleChunk of chunkGraph.getModuleChunksIterable(
+													module
+												)) {
+													const chunkRuntime = moduleChunk.runtime;
+													const inRuntime =
+														typeof chunkRuntime === "string"
+															? chunkRuntime === runtime
+															: chunkRuntime !== undefined &&
+																chunkRuntime.has(
+																	/** @type {string} */ (runtime)
+																);
+													if (inRuntime) {
+														item.forceLoadChunkIds.add(
+															/** @type {ChunkId} */ (moduleChunk.id)
+														);
+														break;
+													}
+												}
+												return;
+											}
 											item.removedModules.add(module);
 										});
 									}
@@ -820,6 +839,7 @@ class HotModuleReplacementPlugin {
 							removedChunkIds,
 							removedModules,
 							updatedChunkIds,
+							forceLoadChunkIds,
 							filename,
 							assetInfo
 						} of hotUpdateMainContentByRuntime.values()) {
@@ -828,7 +848,8 @@ class HotModuleReplacementPlugin {
 								old &&
 								(!isSubset(old.removedChunkIds, removedChunkIds) ||
 									!isSubset(old.removedModules, removedModules) ||
-									!isSubset(old.updatedChunkIds, updatedChunkIds))
+									!isSubset(old.updatedChunkIds, updatedChunkIds) ||
+									!isSubset(old.forceLoadChunkIds, forceLoadChunkIds))
 							) {
 								compilation.warnings.push(
 									new WebpackError(`HotModuleReplacementPlugin
@@ -845,20 +866,30 @@ To fix this, make sure to include [runtime] in the output.hotUpdateMainFilename
 								for (const chunkId of updatedChunkIds) {
 									old.updatedChunkIds.add(chunkId);
 								}
+								for (const chunkId of forceLoadChunkIds) {
+									old.forceLoadChunkIds.add(chunkId);
+								}
 								continue;
 							}
 							hotUpdateMainContentByFilename.set(filename, {
 								removedChunkIds,
 								removedModules,
 								updatedChunkIds,
+								forceLoadChunkIds,
 								assetInfo
 							});
 						}
 						for (const [
 							filename,
-							{ removedChunkIds, removedModules, updatedChunkIds, assetInfo }
+							{
+								removedChunkIds,
+								removedModules,
+								updatedChunkIds,
+								forceLoadChunkIds,
+								assetInfo
+							}
 						] of hotUpdateMainContentByFilename) {
-							/** @type {{ c: ChunkId[], r: ChunkId[], m: ModuleId[], css?: { r: ChunkId[] } }} */
+							/** @type {{ c: ChunkId[], r: ChunkId[], m: ModuleId[], f?: ChunkId[], css?: { r: ChunkId[] } }} */
 							const hotUpdateMainJson = {
 								c: [...updatedChunkIds],
 								r: [...removedChunkIds],
@@ -875,6 +906,12 @@ To fix this, make sure to include [runtime] in the output.hotUpdateMainFilename
 											]
 							};
 
+							// Chunks the client must load so a module whose only loaded chunk
+							// left a runtime keeps an installed owner (see force-load branch).
+							if (forceLoadChunkIds.size > 0) {
+								hotUpdateMainJson.f = [...forceLoadChunkIds];
+							}
+
 							// Build CSS removed chunks list (chunks in updatedChunkIds that no longer have CSS)
 							/** @type {ChunkId[]} */
 							const cssRemovedChunkIds = [];
@@ -938,7 +975,7 @@ To fix this, make sure to include [runtime] in the output.hotUpdateMainFilename
 						applyImportMetaHot(parser);
 					});
 				normalModuleFactory.hooks.module.tap(PLUGIN_NAME, (module) => {
-					module.hot = true;
+					if (module instanceof NormalModule) module.hot = true;
 					return module;
 				});
 

package/lib/IgnorePlugin.js

@@ -23,6 +23,7 @@ class IgnorePlugin {
 	 * @param {IgnorePluginOptions} options IgnorePlugin options
 	 */
 	constructor(options) {
+		/** @type {IgnorePluginOptions} */
 		this.options = options;
 		this.checkIgnore = this.checkIgnore.bind(this);
 	}

package/lib/InitFragment.js

@@ -67,10 +67,15 @@ class InitFragment {
 	 * @param {string | Source=} endContent the source code that will be included at the end of the module
 	 */
 	constructor(content, stage, position, key, endContent) {
+		/** @type {string | Source | undefined} */
 		this.content = content;
+		/** @type {number} */
 		this.stage = stage;
+		/** @type {number} */
 		this.position = position;
+		/** @type {string | undefined} */
 		this.key = key;
+		/** @type {string | Source | undefined} */
 		this.endContent = endContent;
 	}
 

package/lib/JavascriptMetaInfoPlugin.js

@@ -10,10 +10,11 @@ const {
 	JAVASCRIPT_MODULE_TYPE_DYNAMIC,
 	JAVASCRIPT_MODULE_TYPE_ESM
 } = require("./ModuleTypeConstants");
-const InnerGraph = require("./optimize/InnerGraph");
+const { getInnerGraphUtils } = require("./optimize/InnerGraph");
 
 /** @typedef {import("./Compiler")} Compiler */
 /** @typedef {import("./Module").BuildInfo} BuildInfo */
+/** @typedef {import("./javascript/JavascriptModule").JavascriptModuleBuildInfo} JavascriptModuleBuildInfo */
 /** @typedef {import("./javascript/JavascriptParser")} JavascriptParser */
 
 const PLUGIN_NAME = "JavascriptMetaInfoPlugin";
@@ -28,6 +29,7 @@ class JavascriptMetaInfoPlugin {
 		compiler.hooks.compilation.tap(
 			PLUGIN_NAME,
 			(compilation, { normalModuleFactory }) => {
+				const innerGraph = getInnerGraphUtils(compilation);
 				/**
 				 * Handles the hook callback for this code path.
 				 * @param {JavascriptParser} parser the parser
@@ -36,14 +38,14 @@ class JavascriptMetaInfoPlugin {
 				const handler = (parser) => {
 					parser.hooks.call.for("eval").tap(PLUGIN_NAME, () => {
 						const buildInfo =
-							/** @type {BuildInfo} */
+							/** @type {JavascriptModuleBuildInfo} */
 							(parser.state.module.buildInfo);
 						buildInfo.moduleConcatenationBailout = "eval()";
-						const currentSymbol = InnerGraph.getTopLevelSymbol(parser.state);
+						const currentSymbol = innerGraph.getTopLevelSymbol(parser.state);
 						if (currentSymbol) {
-							InnerGraph.addUsage(parser.state, null, currentSymbol);
+							innerGraph.addUsage(parser.state, null, currentSymbol);
 						} else {
-							InnerGraph.bailout(parser.state);
+							innerGraph.bailout(parser.state);
 						}
 					});
 					parser.hooks.finish.tap(PLUGIN_NAME, () => {