webpack 5.86.0 → 5.88.0

package/lib/SourceMapDevToolModuleOptionsPlugin.js

@@ -7,9 +7,13 @@
 
 const JavascriptModulesPlugin = require("./javascript/JavascriptModulesPlugin");
 
+/** @typedef {import("../declarations/plugins/SourceMapDevToolPlugin").SourceMapDevToolPluginOptions} SourceMapDevToolPluginOptions */
 /** @typedef {import("./Compilation")} Compilation */
 
 class SourceMapDevToolModuleOptionsPlugin {
+	/**
+	 * @param {SourceMapDevToolPluginOptions} options options
+	 */
 	constructor(options) {
 		this.options = options;
 	}

package/lib/SourceMapDevToolPlugin.js

@@ -22,6 +22,7 @@ const { makePathsAbsolute } = require("./util/identifier");
 /** @typedef {import("./Cache").Etag} Etag */
 /** @typedef {import("./CacheFacade").ItemCacheFacade} ItemCacheFacade */
 /** @typedef {import("./Chunk")} Chunk */
+/** @typedef {import("./Compilation").Asset} Asset */
 /** @typedef {import("./Compilation").AssetInfo} AssetInfo */
 /** @typedef {import("./Compilation").PathData} PathData */
 /** @typedef {import("./Compiler")} Compiler */
@@ -227,7 +228,9 @@ class SourceMapDevToolPlugin {
 					asyncLib.each(
 						files,
 						(file, callback) => {
-							const asset = compilation.getAsset(file);
+							const asset =
+								/** @type {Readonly<Asset>} */
+								(compilation.getAsset(file));
 							if (asset.info.related && asset.info.related.sourceMap) {
 								fileIndex++;
 								return callback();
@@ -363,7 +366,9 @@ class SourceMapDevToolPlugin {
 							// find modules with conflicting source names
 							for (let idx = 0; idx < allModules.length; idx++) {
 								const module = allModules[idx];
-								let sourceName = moduleToSourceNameMapping.get(module);
+								let sourceName =
+									/** @type {string} */
+									(moduleToSourceNameMapping.get(module));
 								let hasName = conflictDetectionSet.has(sourceName);
 								if (!hasName) {
 									conflictDetectionSet.add(sourceName);

package/lib/UseStrictPlugin.js

@@ -13,7 +13,10 @@ const {
 const ConstDependency = require("./dependencies/ConstDependency");
 
 /** @typedef {import("./Compiler")} Compiler */
+/** @typedef {import("./Dependency").DependencyLocation} DependencyLocation */
+/** @typedef {import("./Module").BuildInfo} BuildInfo */
 /** @typedef {import("./javascript/JavascriptParser")} JavascriptParser */
+/** @typedef {import("./javascript/JavascriptParser").Range} Range */
 
 const PLUGIN_NAME = "UseStrictPlugin";
 
@@ -42,10 +45,14 @@ class UseStrictPlugin {
 							// Remove "use strict" expression. It will be added later by the renderer again.
 							// This is necessary in order to not break the strict mode when webpack prepends code.
 							// @see https://github.com/webpack/webpack/issues/1970
-							const dep = new ConstDependency("", firstNode.range);
-							dep.loc = firstNode.loc;
+							const dep = new ConstDependency(
+								"",
+								/** @type {Range} */ (firstNode.range)
+							);
+							dep.loc = /** @type {DependencyLocation} */ (firstNode.loc);
 							parser.state.module.addPresentationalDependency(dep);
-							parser.state.module.buildInfo.strict = true;
+							/** @type {BuildInfo} */
+							(parser.state.module.buildInfo).strict = true;
 						}
 					});
 				};

package/lib/WebpackError.js

@@ -22,16 +22,17 @@ class WebpackError extends Error {
 	constructor(message) {
 		super(message);
 
+		/** @type {string | undefined} */
 		this.details = undefined;
-		/** @type {Module} */
+		/** @type {Module | undefined | null} */
 		this.module = undefined;
-		/** @type {DependencyLocation} */
+		/** @type {DependencyLocation | undefined} */
 		this.loc = undefined;
-		/** @type {boolean} */
+		/** @type {boolean | undefined} */
 		this.hideStack = undefined;
-		/** @type {Chunk} */
+		/** @type {Chunk | undefined} */
 		this.chunk = undefined;
-		/** @type {string} */
+		/** @type {string | undefined} */
 		this.file = undefined;
 	}
 

package/lib/WebpackIsIncludedPlugin.js

@@ -16,10 +16,12 @@ const {
 	toConstantDependency
 } = require("./javascript/JavascriptParserHelpers");
 
-/** @typedef {import("enhanced-resolve/lib/Resolver")} Resolver */
+/** @typedef {import("enhanced-resolve").Resolver} Resolver */
 /** @typedef {import("./Compiler")} Compiler */
+/** @typedef {import("./Dependency").DependencyLocation} DependencyLocation */
 /** @typedef {import("./Module")} Module */
 /** @typedef {import("./javascript/JavascriptParser")} JavascriptParser */
+/** @typedef {import("./javascript/JavascriptParser").Range} Range */
 
 const PLUGIN_NAME = "WebpackIsIncludedPlugin";
 
@@ -61,10 +63,10 @@ class WebpackIsIncludedPlugin {
 							if (!request.isString()) return;
 
 							const dep = new WebpackIsIncludedDependency(
-								request.string,
-								expr.range
+								/** @type {string} */ (request.string),
+								/** @type {Range} */ (expr.range)
 							);
-							dep.loc = expr.loc;
+							dep.loc = /** @type {DependencyLocation} */ (expr.loc);
 							parser.state.module.addDependency(dep);
 							return true;
 						});

package/lib/WebpackOptionsApply.js

@@ -566,7 +566,7 @@ class WebpackOptionsApply extends OptionsApply {
 			for (const minimizer of options.optimization.minimizer) {
 				if (typeof minimizer === "function") {
 					minimizer.call(compiler, compiler);
-				} else if (minimizer !== "...") {
+				} else if (minimizer !== "..." && minimizer) {
 					minimizer.apply(compiler);
 				}
 			}

package/lib/WebpackOptionsDefaulter.js

@@ -8,11 +8,18 @@
 const { applyWebpackOptionsDefaults } = require("./config/defaults");
 const { getNormalizedWebpackOptions } = require("./config/normalization");
 
+/** @typedef {import("./config/normalization").WebpackOptions} WebpackOptions */
+/** @typedef {import("./config/normalization").WebpackOptionsNormalized} WebpackOptionsNormalized */
+
 class WebpackOptionsDefaulter {
+	/**
+	 * @param {WebpackOptions} options webpack options
+	 * @returns {WebpackOptionsNormalized} normalized webpack options
+	 */
 	process(options) {
-		options = getNormalizedWebpackOptions(options);
-		applyWebpackOptionsDefaults(options);
-		return options;
+		const normalizedOptions = getNormalizedWebpackOptions(options);
+		applyWebpackOptionsDefaults(normalizedOptions);
+		return normalizedOptions;
 	}
 }
 

package/lib/asset/AssetGenerator.js

@@ -181,6 +181,7 @@ class AssetGenerator extends Generator {
 			);
 		}
 
+		/** @type {string | boolean | undefined} */
 		let mimeType = this.dataUrlOptions.mimetype;
 		if (mimeType === undefined) {
 			const ext = path.extname(module.nameForCondition());
@@ -213,7 +214,7 @@ class AssetGenerator extends Generator {
 			);
 		}
 
-		return mimeType;
+		return /** @type {string} */ (mimeType);
 	}
 
 	/**

package/lib/asset/AssetParser.js

@@ -9,6 +9,8 @@ const Parser = require("../Parser");
 
 /** @typedef {import("../../declarations/WebpackOptions").AssetParserDataUrlOptions} AssetParserDataUrlOptions */
 /** @typedef {import("../../declarations/WebpackOptions").AssetParserOptions} AssetParserOptions */
+/** @typedef {import("../Module").BuildInfo} BuildInfo */
+/** @typedef {import("../Module").BuildMeta} BuildMeta */
 /** @typedef {import("../Parser").ParserState} ParserState */
 /** @typedef {import("../Parser").PreparsedAst} PreparsedAst */
 
@@ -30,22 +32,25 @@ class AssetParser extends Parser {
 		if (typeof source === "object" && !Buffer.isBuffer(source)) {
 			throw new Error("AssetParser doesn't accept preparsed AST");
 		}
-		state.module.buildInfo.strict = true;
-		state.module.buildMeta.exportsType = "default";
-		state.module.buildMeta.defaultObject = false;
+
+		const buildInfo = /** @type {BuildInfo} */ (state.module.buildInfo);
+		buildInfo.strict = true;
+		const buildMeta = /** @type {BuildMeta} */ (state.module.buildMeta);
+		buildMeta.exportsType = "default";
+		buildMeta.defaultObject = false;
 
 		if (typeof this.dataUrlCondition === "function") {
-			state.module.buildInfo.dataUrl = this.dataUrlCondition(source, {
+			buildInfo.dataUrl = this.dataUrlCondition(source, {
 				filename: state.module.matchResource || state.module.resource,
 				module: state.module
 			});
 		} else if (typeof this.dataUrlCondition === "boolean") {
-			state.module.buildInfo.dataUrl = this.dataUrlCondition;
+			buildInfo.dataUrl = this.dataUrlCondition;
 		} else if (
 			this.dataUrlCondition &&
 			typeof this.dataUrlCondition === "object"
 		) {
-			state.module.buildInfo.dataUrl =
+			buildInfo.dataUrl =
 				Buffer.byteLength(source) <=
 				/** @type {NonNullable<AssetParserDataUrlOptions["maxSize"]>} */
 				(this.dataUrlCondition.maxSize);

package/lib/asset/AssetSourceParser.js

@@ -7,6 +7,8 @@
 
 const Parser = require("../Parser");
 
+/** @typedef {import("../Module").BuildInfo} BuildInfo */
+/** @typedef {import("../Module").BuildMeta} BuildMeta */
 /** @typedef {import("../Parser").ParserState} ParserState */
 /** @typedef {import("../Parser").PreparsedAst} PreparsedAst */
 
@@ -21,9 +23,12 @@ class AssetSourceParser extends Parser {
 			throw new Error("AssetSourceParser doesn't accept preparsed AST");
 		}
 		const { module } = state;
-		module.buildInfo.strict = true;
-		module.buildMeta.exportsType = "default";
-		state.module.buildMeta.defaultObject = false;
+		/** @type {BuildInfo} */
+		(module.buildInfo).strict = true;
+		/** @type {BuildMeta} */
+		(module.buildMeta).exportsType = "default";
+		/** @type {BuildMeta} */
+		(state.module.buildMeta).defaultObject = false;
 
 		return state;
 	}

package/lib/async-modules/AwaitDependenciesInitFragment.js

@@ -29,6 +29,10 @@ class AwaitDependenciesInitFragment extends InitFragment {
 		this.promises = promises;
 	}
 
+	/**
+	 * @param {AwaitDependenciesInitFragment} other other AwaitDependenciesInitFragment
+	 * @returns {AwaitDependenciesInitFragment} AwaitDependenciesInitFragment
+	 */
 	merge(other) {
 		const promises = new Set(other.promises);
 		for (const p of this.promises) {

package/lib/cache/IdleFileCachePlugin.js

@@ -50,7 +50,7 @@ class IdleFileCachePlugin {
 		let timeSpendInStore = 0;
 		let avgTimeSpendInStore = 0;
 
-		/** @type {Map<string | typeof BUILD_DEPENDENCIES_KEY, () => Promise>} */
+		/** @type {Map<string | typeof BUILD_DEPENDENCIES_KEY, () => Promise<void>>} */
 		const pendingIdleTasks = new Map();
 
 		compiler.cache.hooks.store.tap(
@@ -171,6 +171,7 @@ class IdleFileCachePlugin {
 				isInitialStore = false;
 			}
 		};
+		/** @type {ReturnType<typeof setTimeout> | undefined} */
 		let idleTimer = undefined;
 		compiler.cache.hooks.beginIdle.tap(
 			{ name: "IdleFileCachePlugin", stage: Cache.STAGE_DISK },

package/lib/cache/PackFileCacheStrategy.js

@@ -22,6 +22,8 @@ const {
 /** @typedef {import("../Compiler")} Compiler */
 /** @typedef {import("../FileSystemInfo").Snapshot} Snapshot */
 /** @typedef {import("../logging/Logger").Logger} Logger */
+/** @typedef {import("../serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
+/** @typedef {import("../serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */
 /** @typedef {import("../util/fs").IntermediateFileSystem} IntermediateFileSystem */
 
 class PackContainer {
@@ -58,6 +60,9 @@ class PackContainer {
 		writeLazy(this.data);
 	}
 
+	/**
+	 * @param {ObjectDeserializerContext} context context
+	 */
 	deserialize({ read }) {
 		this.version = read();
 		this.buildSnapshot = read();
@@ -99,7 +104,7 @@ class Pack {
 	constructor(logger, maxAge) {
 		/** @type {Map<string, PackItemInfo>} */
 		this.itemInfo = new Map();
-		/** @type {string[]} */
+		/** @type {(string | undefined)[]} */
 		this.requests = [];
 		this.requestsTimeout = undefined;
 		/** @type {Map<string, PackItemInfo>} */
@@ -111,6 +116,9 @@ class Pack {
 		this.maxAge = maxAge;
 	}
 
+	/**
+	 * @param {string} identifier identifier
+	 */
 	_addRequest(identifier) {
 		this.requests.push(identifier);
 		if (this.requestsTimeout === undefined) {
@@ -149,7 +157,7 @@ class Pack {
 			if (!this.content[loc]) {
 				return undefined;
 			}
-			return this.content[loc].get(identifier);
+			return /** @type {PackContent} */ (this.content[loc]).get(identifier);
 		}
 	}
 
@@ -175,7 +183,7 @@ class Pack {
 			if (loc >= 0) {
 				this._addRequest(identifier);
 				this.freshContent.set(identifier, info);
-				const content = this.content[loc];
+				const content = /** @type {PackContent} */ (this.content[loc]);
 				content.delete(identifier);
 				if (content.items.size === 0) {
 					this.content[loc] = undefined;
@@ -351,11 +359,12 @@ class Pack {
 			mergedIndices = smallUnusedContents;
 		} else return;
 
+		/** @type {PackContent[] } */
 		const mergedContent = [];
 
 		// 3. Remove old content entries
 		for (const i of mergedIndices) {
-			mergedContent.push(this.content[i]);
+			mergedContent.push(/** @type {PackContent} */ (this.content[i]));
 			this.content[i] = undefined;
 		}
 
@@ -364,7 +373,7 @@ class Pack {
 		const mergedItems = new Set();
 		/** @type {Set<string>} */
 		const mergedUsedItems = new Set();
-		/** @type {(function(Map<string, any>): Promise)[]} */
+		/** @type {(function(Map<string, any>): Promise<void>)[]} */
 		const addToMergedMap = [];
 		for (const content of mergedContent) {
 			for (const identifier of content.items) {
@@ -498,17 +507,20 @@ class Pack {
 	 * Only runs for one content to avoid large invalidation.
 	 */
 	_gcOldestContent() {
-		/** @type {PackItemInfo} */
+		/** @type {PackItemInfo | undefined} */
 		let oldest = undefined;
 		for (const info of this.itemInfo.values()) {
 			if (oldest === undefined || info.lastAccess < oldest.lastAccess) {
 				oldest = info;
 			}
 		}
-		if (Date.now() - oldest.lastAccess > this.maxAge) {
-			const loc = oldest.location;
+		if (
+			Date.now() - /** @type {PackItemInfo} */ (oldest).lastAccess >
+			this.maxAge
+		) {
+			const loc = /** @type {PackItemInfo} */ (oldest).location;
 			if (loc < 0) return;
-			const content = this.content[loc];
+			const content = /** @type {PackContent} */ (this.content[loc]);
 			const items = new Set(content.items);
 			const usedItems = new Set(content.used);
 			this._gcAndUpdateLocation(items, usedItems, loc);
@@ -771,6 +783,7 @@ class PackContent {
 
 		// We are in state B
 		const { lazyName } = this;
+		/** @type {string | undefined} */
 		let timeMessage;
 		if (lazyName) {
 			// only log once
@@ -811,7 +824,7 @@ class PackContent {
 
 	/**
 	 * @param {string} reason explanation why unpack is necessary
-	 * @returns {void | Promise} maybe a promise if lazy
+	 * @returns {void | Promise<void>} maybe a promise if lazy
 	 */
 	unpack(reason) {
 		if (this.content) return;
@@ -819,6 +832,7 @@ class PackContent {
 		// Move from state B to C
 		if (this.lazy) {
 			const { lazyName } = this;
+			/** @type {string | undefined} */
 			let timeMessage;
 			if (lazyName) {
 				// only log once
@@ -862,6 +876,9 @@ class PackContent {
 		return size;
 	}
 
+	/**
+	 * @param {string} identifier identifier
+	 */
 	delete(identifier) {
 		this.items.delete(identifier);
 		this.used.delete(identifier);
@@ -906,6 +923,7 @@ class PackContent {
 		}
 		// State B2
 		const { lazyName } = this;
+		/** @type {string | undefined} */
 		let timeMessage;
 		if (lazyName) {
 			// only log once
@@ -1028,17 +1046,20 @@ class PackFileCacheStrategy {
 		this.buildDependencies = new Set();
 		/** @type {LazySet<string>} */
 		this.newBuildDependencies = new LazySet();
-		/** @type {Snapshot} */
+		/** @type {Snapshot | undefined} */
 		this.resolveBuildDependenciesSnapshot = undefined;
-		/** @type {Map<string, string | false>} */
+		/** @type {Map<string, string | false> | undefined} */
 		this.resolveResults = undefined;
-		/** @type {Snapshot} */
+		/** @type {Snapshot | undefined} */
 		this.buildSnapshot = undefined;
-		/** @type {Promise<Pack>} */
+		/** @type {Promise<Pack> | undefined} */
 		this.packPromise = this._openPack();
 		this.storePromise = Promise.resolve();
 	}
 
+	/**
+	 * @returns {Promise<Pack>} pack
+	 */
 	_getPack() {
 		if (this.packPromise === undefined) {
 			this.packPromise = this.storePromise.then(() => this._openPack());

package/lib/config/browserslistTargetHandler.js

@@ -120,7 +120,7 @@ const resolve = browsers => {
 		and_qq: [10, 4],
 		// baidu: Not supported
 		// and_uc: Not supported
-		// kaios: Not supported
+		kaios: [3, 0],
 		node: [12, 17]
 	});
 
@@ -187,7 +187,7 @@ const resolve = browsers => {
 			// and_qq: Unknown support
 			// baidu: Unknown support
 			// and_uc: Unknown support
-			// kaios: Unknown support
+			kaios: [3, 0],
 			node: [0, 12]
 		}),
 		destructuring: rawChecker({
@@ -206,7 +206,7 @@ const resolve = browsers => {
 			// and_qq: Unknown support
 			// baidu: Unknown support
 			// and_uc: Unknown support
-			// kaios: Unknown support
+			kaios: [2, 5],
 			node: [6, 0]
 		}),
 		bigIntLiteral: rawChecker({
@@ -225,7 +225,7 @@ const resolve = browsers => {
 			// and_qq: Not supported
 			// baidu: Not supported
 			// and_uc: Not supported
-			// kaios: Not supported
+			kaios: [3, 0],
 			node: [10, 4]
 		}),
 		// Support syntax `import` and `export` and no limitations and bugs on Node.js
@@ -246,7 +246,7 @@ const resolve = browsers => {
 			and_qq: [10, 4],
 			// baidu: Not supported
 			// and_uc: Not supported
-			// kaios: Not supported
+			kaios: [3, 0],
 			node: [12, 17]
 		}),
 		dynamicImport: es6DynamicImport,
@@ -269,7 +269,7 @@ const resolve = browsers => {
 			// and_qq: Unknown support
 			// baidu: Unknown support
 			// and_uc: Unknown support
-			// kaios: Unknown support
+			kaios: [3, 0],
 			node: 12
 		}),
 		optionalChaining: rawChecker({
@@ -288,7 +288,7 @@ const resolve = browsers => {
 			// and_qq: Not supported
 			// baidu: Not supported
 			// and_uc: Not supported
-			// kaios: Not supported
+			kaios: [3, 0],
 			node: 14
 		}),
 		templateLiteral: rawChecker({

package/lib/config/defaults.js

@@ -15,7 +15,9 @@ const {
 	JAVASCRIPT_MODULE_TYPE_DYNAMIC,
 	WEBASSEMBLY_MODULE_TYPE_SYNC,
 	ASSET_MODULE_TYPE,
-	CSS_MODULE_TYPE
+	CSS_MODULE_TYPE_AUTO,
+	CSS_MODULE_TYPE,
+	CSS_MODULE_TYPE_MODULE
 } = require("../ModuleTypeConstants");
 const Template = require("../Template");
 const { cleverMerge } = require("../util/cleverMerge");
@@ -298,7 +300,10 @@ const applyWebpackOptionsDefaults = options => {
 			cache,
 			context: /** @type {Context} */ (options.context),
 			targetProperties,
-			mode: /** @type {Mode} */ (options.mode)
+			mode: /** @type {Mode} */ (options.mode),
+			css:
+				/** @type {NonNullable<ExperimentsNormalized["css"]>} */
+				(options.experiments.css)
 		}),
 		options.resolve
 	);
@@ -533,6 +538,7 @@ const applyJavascriptParserOptionsDefaults = (
 	D(parserOptions, "dynamicImportMode", "lazy");
 	D(parserOptions, "dynamicImportPrefetch", false);
 	D(parserOptions, "dynamicImportPreload", false);
+	D(parserOptions, "dynamicImportFetchPriority", false);
 	D(parserOptions, "createRequire", isNode);
 	if (futureDefaults) D(parserOptions, "exportsPresence", "error");
 };
@@ -704,38 +710,24 @@ const applyModuleDefaults = (
 			});
 		}
 		if (css) {
-			const cssRule = {
-				type: CSS_MODULE_TYPE,
-				resolve: {
-					fullySpecified: true,
-					preferRelative: true
-				}
-			};
-			const cssModulesRule = {
-				type: "css/module",
-				resolve: {
-					fullySpecified: true
-				}
+			const resolve = {
+				fullySpecified: true,
+				preferRelative: true
 			};
 			rules.push({
 				test: /\.css$/i,
-				oneOf: [
-					{
-						test: /\.module\.css$/i,
-						...cssModulesRule
-					},
-					{
-						...cssRule
-					}
-				]
+				type: CSS_MODULE_TYPE_AUTO,
+				resolve
 			});
 			rules.push({
 				mimetype: "text/css+module",
-				...cssModulesRule
+				type: CSS_MODULE_TYPE_MODULE,
+				resolve
 			});
 			rules.push({
 				mimetype: "text/css",
-				...cssRule
+				type: CSS_MODULE_TYPE,
+				resolve
 			});
 		}
 		rules.push(
@@ -1398,9 +1390,16 @@ const applyOptimizationDefaults = (
  * @param {string} options.context build context
  * @param {TargetProperties | false} options.targetProperties target properties
  * @param {Mode} options.mode mode
+ * @param {CssExperimentOptions|false} options.css is css enabled
  * @returns {ResolveOptions} resolve options
  */
-const getResolveDefaults = ({ cache, context, targetProperties, mode }) => {
+const getResolveDefaults = ({
+	cache,
+	context,
+	targetProperties,
+	mode,
+	css
+}) => {
 	/** @type {string[]} */
 	const conditions = ["webpack"];
 
@@ -1468,6 +1467,24 @@ const getResolveDefaults = ({ cache, context, targetProperties, mode }) => {
 		}
 	};
 
+	if (css) {
+		const styleConditions = [];
+
+		styleConditions.push("webpack");
+		styleConditions.push(mode === "development" ? "development" : "production");
+		styleConditions.push("style");
+
+		resolveOptions.byDependency["css-import"] = {
+			// We avoid using any main files because we have to be consistent with CSS `@import`
+			// and CSS `@import` does not handle `main` files in directories,
+			// you should always specify the full URL for styles
+			mainFiles: [],
+			mainFields: ["style", "..."],
+			conditionNames: styleConditions,
+			extensions: [".css"]
+		};
+	}
+
 	return resolveOptions;
 };
 

package/lib/container/RemoteRuntimeModule.js

@@ -18,7 +18,7 @@ class RemoteRuntimeModule extends RuntimeModule {
 	}
 
 	/**
-	 * @returns {string} runtime code
+	 * @returns {string | null} runtime code
 	 */
 	generate() {
 		const { compilation, chunkGraph } = this;