webpack 5.85.0 → 5.86.0

package/lib/ProgressPlugin.js

@@ -11,9 +11,20 @@ const NormalModule = require("./NormalModule");
 const createSchemaValidation = require("./util/create-schema-validation");
 const { contextify } = require("./util/identifier");
 
+/** @typedef {import("tapable").Tap} Tap */
 /** @typedef {import("../declarations/plugins/ProgressPlugin").HandlerFunction} HandlerFunction */
 /** @typedef {import("../declarations/plugins/ProgressPlugin").ProgressPluginArgument} ProgressPluginArgument */
 /** @typedef {import("../declarations/plugins/ProgressPlugin").ProgressPluginOptions} ProgressPluginOptions */
+/** @typedef {import("./Dependency")} Dependency */
+/** @typedef {import("./Entrypoint").EntryOptions} EntryOptions */
+/** @typedef {import("./Module")} Module */
+/** @typedef {import("./logging/Logger").Logger} Logger */
+
+/**
+ * @typedef {Object} CountsData
+ * @property {number} modulesCount modules count
+ * @property {number} dependenciesCount dependencies count
+ */
 
 const validate = createSchemaValidation(
 	require("../schemas/plugins/ProgressPlugin.check.js"),
@@ -23,14 +34,31 @@ const validate = createSchemaValidation(
 		baseDataPath: "options"
 	}
 );
+
+/**
+ * @param {number} a a
+ * @param {number} b b
+ * @param {number} c c
+ * @returns {number} median
+ */
 const median3 = (a, b, c) => {
 	return a + b + c - Math.max(a, b, c) - Math.min(a, b, c);
 };
 
+/**
+ * @param {boolean | null | undefined} profile need profile
+ * @param {Logger} logger logger
+ * @returns {defaultHandler} default handler
+ */
 const createDefaultHandler = (profile, logger) => {
-	/** @type {{ value: string, time: number }[]} */
+	/** @type {{ value: string | undefined, time: number }[]} */
 	const lastStateInfo = [];
 
+	/**
+	 * @param {number} percentage percentage
+	 * @param {string} msg message
+	 * @param {...string} args additional arguments
+	 */
 	const defaultHandler = (percentage, msg, ...args) => {
 		if (profile) {
 			if (percentage === 0) {
@@ -95,18 +123,18 @@ const createDefaultHandler = (profile, logger) => {
 
 /**
  * @callback ReportProgress
- * @param {number} p
- * @param {...string} [args]
+ * @param {number} p percentage
+ * @param {...string} args additional arguments
  * @returns {void}
  */
 
-/** @type {WeakMap<Compiler,ReportProgress>} */
+/** @type {WeakMap<Compiler, ReportProgress | undefined>} */
 const progressReporters = new WeakMap();
 
 class ProgressPlugin {
 	/**
 	 * @param {Compiler} compiler the current compiler
-	 * @returns {ReportProgress} a progress reporter, if any
+	 * @returns {ReportProgress | undefined} a progress reporter, if any
 	 */
 	static getReporter(compiler) {
 		return progressReporters.get(compiler);
@@ -288,6 +316,9 @@ class ProgressPlugin {
 		};
 
 		// only used when showActiveModules is set
+		/**
+		 * @param {Module} module the module
+		 */
 		const moduleBuild = module => {
 			const ident = module.identifier();
 			if (ident) {
@@ -297,11 +328,18 @@ class ProgressPlugin {
 			}
 		};
 
+		/**
+		 * @param {Dependency} entry entry dependency
+		 * @param {EntryOptions} options options object
+		 */
 		const entryAdd = (entry, options) => {
 			entriesCount++;
 			if (entriesCount < 5 || entriesCount % 10 === 0) updateThrottled();
 		};
 
+		/**
+		 * @param {Module} module the module
+		 */
 		const moduleDone = module => {
 			doneModules++;
 			if (showActiveModules) {
@@ -321,6 +359,10 @@ class ProgressPlugin {
 			if (doneModules < 50 || doneModules % 100 === 0) updateThrottled();
 		};
 
+		/**
+		 * @param {Dependency} entry entry dependency
+		 * @param {EntryOptions} options options object
+		 */
 		const entryDone = (entry, options) => {
 			doneEntries++;
 			update();
@@ -330,6 +372,7 @@ class ProgressPlugin {
 			.getCache("ProgressPlugin")
 			.getItemCache("counts", null);
 
+		/** @type {Promise<CountsData> | undefined} */
 		let cacheGetPromise;
 
 		compiler.hooks.beforeCompile.tap("ProgressPlugin", () => {
@@ -352,15 +395,17 @@ class ProgressPlugin {
 
 		compiler.hooks.afterCompile.tapPromise("ProgressPlugin", compilation => {
 			if (compilation.compiler.isChild()) return Promise.resolve();
-			return cacheGetPromise.then(async oldData => {
-				if (
-					!oldData ||
-					oldData.modulesCount !== modulesCount ||
-					oldData.dependenciesCount !== dependenciesCount
-				) {
-					await cache.storePromise({ modulesCount, dependenciesCount });
+			return /** @type {Promise<CountsData>} */ (cacheGetPromise).then(
+				async oldData => {
+					if (
+						!oldData ||
+						oldData.modulesCount !== modulesCount ||
+						oldData.dependenciesCount !== dependenciesCount
+					) {
+						await cache.storePromise({ modulesCount, dependenciesCount });
+					}
 				}
-			});
+			);
 		});
 
 		compiler.hooks.compilation.tap("ProgressPlugin", compilation => {
@@ -463,9 +508,9 @@ class ProgressPlugin {
 			};
 			const numberOfHooks = Object.keys(hooks).length;
 			Object.keys(hooks).forEach((name, idx) => {
-				const title = hooks[name];
+				const title = hooks[/** @type {keyof typeof hooks} */ (name)];
 				const percentage = (idx / numberOfHooks) * 0.25 + 0.7;
-				compilation.hooks[name].intercept({
+				compilation.hooks[/** @type {keyof typeof hooks} */ (name)].intercept({
 					name: "ProgressPlugin",
 					call() {
 						handler(percentage, "sealing", title);
@@ -500,6 +545,12 @@ class ProgressPlugin {
 				handler(0.65, "building");
 			}
 		});
+		/**
+		 * @param {TODO} hook hook
+		 * @param {number} progress progress from 0 to 1
+		 * @param {string} category category
+		 * @param {string} name name
+		 */
 		const interceptHook = (hook, progress, category, name) => {
 			hook.intercept({
 				name: "ProgressPlugin",
@@ -516,6 +567,9 @@ class ProgressPlugin {
 				error() {
 					handler(progress, category, name);
 				},
+				/**
+				 * @param {Tap} tap tap
+				 */
 				tap(tap) {
 					progressReporters.set(compiler, (p, ...args) => {
 						handler(progress, category, name, tap.name, ...args);
@@ -610,4 +664,6 @@ ProgressPlugin.defaultOptions = {
 	entries: true
 };
 
+ProgressPlugin.createDefaultHandler = createDefaultHandler;
+
 module.exports = ProgressPlugin;

package/lib/WebpackOptionsApply.js

@@ -368,7 +368,9 @@ class WebpackOptionsApply extends OptionsApply {
 			const NodeStuffPlugin = require("./NodeStuffPlugin");
 			new NodeStuffPlugin(options.node).apply(compiler);
 		}
-		new APIPlugin().apply(compiler);
+		new APIPlugin({
+			module: options.output.module
+		}).apply(compiler);
 		new ExportsInfoApiPlugin().apply(compiler);
 		new WebpackIsIncludedPlugin().apply(compiler);
 		new ConstPlugin().apply(compiler);

package/lib/css/CssExportsGenerator.js

@@ -19,6 +19,11 @@ const Template = require("../Template");
 /** @typedef {import("../NormalModule")} NormalModule */
 /** @typedef {import("../util/Hash")} Hash */
 
+/**
+ * @template T
+ * @typedef {import("../InitFragment")<T>} InitFragment
+ */
+
 const TYPES = new Set(["javascript"]);
 
 class CssExportsGenerator extends Generator {
@@ -36,6 +41,7 @@ class CssExportsGenerator extends Generator {
 	 */
 	generate(module, generateContext) {
 		const source = new ReplaceSource(new RawSource(""));
+		/** @type {InitFragment<TODO>[]} */
 		const initFragments = [];
 		const cssExports = new Map();
 
@@ -57,6 +63,9 @@ class CssExportsGenerator extends Generator {
 			cssExports
 		};
 
+		/**
+		 * @param {Dependency} dependency the dependency
+		 */
 		const handleDependency = dependency => {
 			const constructor = /** @type {new (...args: any[]) => Dependency} */ (
 				dependency.constructor

package/lib/css/CssGenerator.js

@@ -30,7 +30,7 @@ class CssGenerator extends Generator {
 	 * @returns {Source} generated code
 	 */
 	generate(module, generateContext) {
-		const originalSource = module.originalSource();
+		const originalSource = /** @type {Source} */ (module.originalSource());
 		const source = new ReplaceSource(originalSource);
 		/** @type {InitFragment[]} */
 		const initFragments = [];

package/lib/css/CssLoadingRuntimeModule.js

@@ -14,6 +14,7 @@ const compileBooleanMatcher = require("../util/compileBooleanMatcher");
 const { chunkHasCss } = require("./CssModulesPlugin");
 
 /** @typedef {import("../Chunk")} Chunk */
+/** @typedef {import("../ChunkGraph")} ChunkGraph */
 /** @typedef {import("../Compilation").RuntimeRequirementsContext} RuntimeRequirementsContext */
 
 /**
@@ -67,10 +68,15 @@ class CssLoadingRuntimeModule extends RuntimeModule {
 				uniqueName,
 				chunkLoadTimeout: loadTimeout
 			}
-		} = compilation;
+		} = /** @type {Compilation} */ (compilation);
 		const fn = RuntimeGlobals.ensureChunkHandlers;
 		const conditionMap = chunkGraph.getChunkConditionMap(
-			chunk,
+			/** @type {Chunk} */ (chunk),
+			/**
+			 * @param {Chunk} chunk the chunk
+			 * @param {ChunkGraph} chunkGraph the chunk graph
+			 * @returns {boolean} true, if the chunk has css
+			 */
 			(chunk, chunkGraph) =>
 				!!chunkGraph.getChunkModulesIterableBySourceType(chunk, "css")
 		);
@@ -87,7 +93,7 @@ class CssLoadingRuntimeModule extends RuntimeModule {
 		const initialChunkIdsWithCss = new Set();
 		/** @type {Set<number | string | null>} */
 		const initialChunkIdsWithoutCss = new Set();
-		for (const c of chunk.getAllInitialChunks()) {
+		for (const c of /** @type {Chunk} */ (chunk).getAllInitialChunks()) {
 			(chunkHasCss(c, chunkGraph)
 				? initialChunkIdsWithCss
 				: initialChunkIdsWithoutCss
@@ -98,8 +104,9 @@ class CssLoadingRuntimeModule extends RuntimeModule {
 			return null;
 		}
 
-		const { createStylesheet } =
-			CssLoadingRuntimeModule.getCompilationHooks(compilation);
+		const { createStylesheet } = CssLoadingRuntimeModule.getCompilationHooks(
+			/** @type {Compilation} */ (compilation)
+		);
 
 		const stateExpression = withHmr
 			? `${RuntimeGlobals.hmrRuntimeStatePrefix}_css`
@@ -239,7 +246,7 @@ class CssLoadingRuntimeModule extends RuntimeModule {
 					"if(!link) {",
 					Template.indent([
 						"needAttach = true;",
-						createStylesheet.call(code, this.chunk)
+						createStylesheet.call(code, /** @type {Chunk} */ (this.chunk))
 					]),
 					"}",
 					`var onLinkComplete = ${runtimeTemplate.basicFunction(

package/lib/css/CssModulesPlugin.js

@@ -46,6 +46,10 @@ const getCssLoadingRuntimeModule = memoize(() =>
 	require("./CssLoadingRuntimeModule")
 );
 
+/**
+ * @param {string} name name
+ * @returns {{oneOf: [{$ref: string}], definitions: *}} schema
+ */
 const getSchema = name => {
 	const { definitions } = require("../../schemas/WebpackOptions.json");
 	return {
@@ -302,6 +306,10 @@ class CssModulesPlugin {
 					return result;
 				});
 				const globalChunkLoading = compilation.outputOptions.chunkLoading;
+				/**
+				 * @param {Chunk} chunk the chunk
+				 * @returns {boolean} true, when enabled
+				 */
 				const isEnabledForChunk = chunk => {
 					const options = chunk.getEntryOptions();
 					const chunkLoading =
@@ -311,6 +319,10 @@ class CssModulesPlugin {
 					return chunkLoading === "jsonp";
 				};
 				const onceForChunkSet = new WeakSet();
+				/**
+				 * @param {Chunk} chunk chunk to check
+				 * @param {Set<string>} set runtime requirements
+				 */
 				const handler = (chunk, set) => {
 					if (onceForChunkSet.has(chunk)) return;
 					onceForChunkSet.add(chunk);
@@ -361,7 +373,10 @@ class CssModulesPlugin {
 					};
 				})
 				.filter(item => item.index !== undefined)
-				.sort((a, b) => b.index - a.index)
+				.sort(
+					(a, b) =>
+						/** @type {number} */ (b.index) - /** @type {number} */ (a.index)
+				)
 				.map(item => item.module);
 
 			return { list: sortedModules, set: new Set(sortedModules) };
@@ -455,19 +470,25 @@ class CssModulesPlugin {
 		return [
 			...this.getModulesInOrder(
 				chunk,
-				chunkGraph.getOrderedChunkModulesIterableBySourceType(
-					chunk,
-					"css-import",
-					compareModulesByIdentifier
+				/** @type {Iterable<Module>} */
+				(
+					chunkGraph.getOrderedChunkModulesIterableBySourceType(
+						chunk,
+						"css-import",
+						compareModulesByIdentifier
+					)
 				),
 				compilation
 			),
 			...this.getModulesInOrder(
 				chunk,
-				chunkGraph.getOrderedChunkModulesIterableBySourceType(
-					chunk,
-					"css",
-					compareModulesByIdentifier
+				/** @type {Iterable<Module>} */
+				(
+					chunkGraph.getOrderedChunkModulesIterableBySourceType(
+						chunk,
+						"css",
+						compareModulesByIdentifier
+					)
 				),
 				compilation
 			)
@@ -498,8 +519,11 @@ class CssModulesPlugin {
 				const codeGenResult = codeGenerationResults.get(module, chunk.runtime);
 
 				let moduleSource =
-					codeGenResult.sources.get("css") ||
-					codeGenResult.sources.get("css-import");
+					/** @type {Source} */
+					(
+						codeGenResult.sources.get("css") ||
+							codeGenResult.sources.get("css-import")
+					);
 
 				let inheritance = [[module.cssLayer, module.supports, module.media]];
 
@@ -569,7 +593,8 @@ class CssModulesPlugin {
 					}${escapeCss(moduleId)}`
 				);
 			} catch (e) {
-				e.message += `\nduring rendering of css ${module.identifier()}`;
+				/** @type {Error} */
+				(e).message += `\nduring rendering of css ${module.identifier()}`;
 				throw e;
 			}
 		}

package/lib/dependencies/HarmonyImportDependencyParserPlugin.js

@@ -212,7 +212,7 @@ module.exports = class HarmonyImportDependencyParserPlugin {
 			.for(harmonySpecifierTag)
 			.tap(
 				"HarmonyImportDependencyParserPlugin",
-				(expression, members, membersOptionals, memberRangeStarts) => {
+				(expression, members, membersOptionals, memberRanges) => {
 					const settings = /** @type {HarmonySettings} */ (
 						parser.currentTagData
 					);
@@ -220,10 +220,9 @@ module.exports = class HarmonyImportDependencyParserPlugin {
 						members,
 						membersOptionals
 					);
-					const rangeStarts = memberRangeStarts.slice(
+					const ranges = memberRanges.slice(
 						0,
-						memberRangeStarts.length -
-							(members.length - nonOptionalMembers.length)
+						memberRanges.length - (members.length - nonOptionalMembers.length)
 					);
 					const expr =
 						nonOptionalMembers !== members
@@ -241,7 +240,7 @@ module.exports = class HarmonyImportDependencyParserPlugin {
 						expr.range,
 						exportPresenceMode,
 						settings.assertions,
-						rangeStarts
+						ranges
 					);
 					dep.referencedPropertiesInDestructuring =
 						parser.destructuringAssignmentPropertiesFor(expr);
@@ -256,7 +255,7 @@ module.exports = class HarmonyImportDependencyParserPlugin {
 			.for(harmonySpecifierTag)
 			.tap(
 				"HarmonyImportDependencyParserPlugin",
-				(expression, members, membersOptionals, memberRangeStarts) => {
+				(expression, members, membersOptionals, memberRanges) => {
 					const { arguments: args, callee } = expression;
 					const settings = /** @type {HarmonySettings} */ (
 						parser.currentTagData
@@ -265,10 +264,9 @@ module.exports = class HarmonyImportDependencyParserPlugin {
 						members,
 						membersOptionals
 					);
-					const rangeStarts = memberRangeStarts.slice(
+					const ranges = memberRanges.slice(
 						0,
-						memberRangeStarts.length -
-							(members.length - nonOptionalMembers.length)
+						memberRanges.length - (members.length - nonOptionalMembers.length)
 					);
 					const expr =
 						nonOptionalMembers !== members
@@ -286,7 +284,7 @@ module.exports = class HarmonyImportDependencyParserPlugin {
 						expr.range,
 						exportPresenceMode,
 						settings.assertions,
-						rangeStarts
+						ranges
 					);
 					dep.directImport = members.length === 0;
 					dep.call = true;

package/lib/dependencies/HarmonyImportSpecifierDependency.js

@@ -43,7 +43,7 @@ class HarmonyImportSpecifierDependency extends HarmonyImportDependency {
 	 * @param {Range} range range
 	 * @param {TODO} exportPresenceMode export presence mode
 	 * @param {Assertions=} assertions assertions
-	 * @param {number[]=} idRangeStarts range starts for members of ids; the two arrays are right-aligned
+	 * @param {Range[]=} idRanges ranges for members of ids; the two arrays are right-aligned
 	 */
 	constructor(
 		request,
@@ -53,13 +53,13 @@ class HarmonyImportSpecifierDependency extends HarmonyImportDependency {
 		range,
 		exportPresenceMode,
 		assertions,
-		idRangeStarts // TODO webpack 6 make this non-optional. It must always be set to properly trim ids.
+		idRanges // TODO webpack 6 make this non-optional. It must always be set to properly trim ids.
 	) {
 		super(request, sourceOrder, assertions);
 		this.ids = ids;
 		this.name = name;
 		this.range = range;
-		this.idRangeStarts = idRangeStarts;
+		this.idRanges = idRanges;
 		this.exportPresenceMode = exportPresenceMode;
 		this.namespaceObjectAsContext = false;
 		this.call = undefined;
@@ -261,7 +261,7 @@ class HarmonyImportSpecifierDependency extends HarmonyImportDependency {
 		write(this.ids);
 		write(this.name);
 		write(this.range);
-		write(this.idRangeStarts);
+		write(this.idRanges);
 		write(this.exportPresenceMode);
 		write(this.namespaceObjectAsContext);
 		write(this.call);
@@ -281,7 +281,7 @@ class HarmonyImportSpecifierDependency extends HarmonyImportDependency {
 		this.ids = read();
 		this.name = read();
 		this.range = read();
-		this.idRangeStarts = read();
+		this.idRanges = read();
 		this.exportPresenceMode = read();
 		this.namespaceObjectAsContext = read();
 		this.call = read();
@@ -320,15 +320,15 @@ HarmonyImportSpecifierDependency.Template = class HarmonyImportSpecifierDependen
 
 		let [rangeStart, rangeEnd] = dep.range;
 		if (trimmedIds.length !== ids.length) {
-			// The array returned from dep.idRangeStarts is right-aligned with the array returned from dep.getIds.
+			// The array returned from dep.idRanges is right-aligned with the array returned from dep.getIds.
 			// Meaning, the two arrays may not always have the same number of elements, but the last element of
-			// dep.idRangeStarts corresponds to [the starting range position of] the last element of dep.getIds.
-			// Use this to find the correct range end position based on the number of ids that were trimmed.
+			// dep.idRanges corresponds to [the expression fragment to the left of] the last element of dep.getIds.
+			// Use this to find the correct replacement range based on the number of ids that were trimmed.
 			const idx =
-				dep.idRangeStarts === undefined
+				dep.idRanges === undefined
 					? -1 /* trigger failure case below */
-					: dep.idRangeStarts.length + (trimmedIds.length - ids.length);
-			if (idx < 0 || idx >= dep.idRangeStarts.length) {
+					: dep.idRanges.length + (trimmedIds.length - ids.length);
+			if (idx < 0 || idx >= dep.idRanges.length) {
 				// cspell:ignore minifiers
 				// Should not happen but we can't throw an error here because of backward compatibility with
 				// external plugins in wp5.  Instead, we just disable trimming for now.  This may break some minifiers.
@@ -336,7 +336,7 @@ HarmonyImportSpecifierDependency.Template = class HarmonyImportSpecifierDependen
 				// TODO webpack 6 remove the "trimmedIds = ids" above and uncomment the following line instead.
 				// throw new Error("Missing range starts data for id replacement trimming.");
 			} else {
-				rangeEnd = dep.idRangeStarts[idx];
+				[rangeStart, rangeEnd] = dep.idRanges[idx];
 			}
 		}
 

package/lib/dependencies/JsonExportsDependency.js

@@ -47,7 +47,7 @@ const getExportsFromData = data => {
 
 class JsonExportsDependency extends NullDependency {
 	/**
-	 * @param {JsonData=} data json data
+	 * @param {JsonData} data json data
 	 */
 	constructor(data) {
 		super();

package/lib/javascript/BasicEvaluatedExpression.js

@@ -6,6 +6,7 @@
 "use strict";
 
 /** @typedef {import("estree").Node} EsTreeNode */
+/** @typedef {import("./JavascriptParser").Range} Range */
 /** @typedef {import("./JavascriptParser").VariableInfoInterface} VariableInfoInterface */
 
 const TypeUnknown = 0;
@@ -70,8 +71,8 @@ class BasicEvaluatedExpression {
 		this.getMembers = undefined;
 		/** @type {() => boolean[]} */
 		this.getMembersOptionals = undefined;
-		/** @type {() => number[]} */
-		this.getMemberRangeStarts = undefined;
+		/** @type {() => Range[]} */
+		this.getMemberRanges = undefined;
 		/** @type {EsTreeNode} */
 		this.expression = undefined;
 	}
@@ -386,7 +387,7 @@ class BasicEvaluatedExpression {
 	 * @param {string | VariableInfoInterface} rootInfo root info
 	 * @param {() => string[]} getMembers members
 	 * @param {() => boolean[]=} getMembersOptionals optional members
-	 * @param {() => number[]=} getMemberRangeStarts range start of progressively increasing sub-expressions
+	 * @param {() => Range[]=} getMemberRanges ranges of progressively increasing sub-expressions
 	 * @returns {this} this
 	 */
 	setIdentifier(
@@ -394,14 +395,14 @@ class BasicEvaluatedExpression {
 		rootInfo,
 		getMembers,
 		getMembersOptionals,
-		getMemberRangeStarts
+		getMemberRanges
 	) {
 		this.type = TypeIdentifier;
 		this.identifier = identifier;
 		this.rootInfo = rootInfo;
 		this.getMembers = getMembers;
 		this.getMembersOptionals = getMembersOptionals;
-		this.getMemberRangeStarts = getMemberRangeStarts;
+		this.getMemberRanges = getMemberRanges;
 		this.sideEffects = true;
 		return this;
 	}

package/lib/javascript/JavascriptModulesPlugin.js

@@ -937,6 +937,7 @@ class JavascriptModulesPlugin {
 				"JavascriptModulesPlugin error: JavascriptModulesPlugin.getCompilationHooks().renderContent plugins should return something"
 			);
 		}
+
 		finalSource = InitFragment.addToSource(
 			finalSource,
 			chunkRenderContext.chunkInitFragments,