webpack 5.90.3 → 5.92.0

package/lib/TemplatedPathPlugin.js

@@ -12,25 +12,47 @@ const Chunk = require("./Chunk");
 const Module = require("./Module");
 const { parseResource } = require("./util/identifier");
 
+/** @typedef {import("./ChunkGraph")} ChunkGraph */
 /** @typedef {import("./Compilation").AssetInfo} AssetInfo */
 /** @typedef {import("./Compilation").PathData} PathData */
 /** @typedef {import("./Compiler")} Compiler */
 
 const REGEXP = /\[\\*([\w:]+)\\*\]/gi;
 
+/**
+ * @param {string | number} id id
+ * @returns {string | number} result
+ */
 const prepareId = id => {
 	if (typeof id !== "string") return id;
 
 	if (/^"\s\+*.*\+\s*"$/.test(id)) {
 		const match = /^"\s\+*\s*(.*)\s*\+\s*"$/.exec(id);
 
-		return `" + (${match[1]} + "").replace(/(^[.-]|[^a-zA-Z0-9_-])+/g, "_") + "`;
+		return `" + (${
+			/** @type {string[]} */ (match)[1]
+		} + "").replace(/(^[.-]|[^a-zA-Z0-9_-])+/g, "_") + "`;
 	}
 
 	return id.replace(/(^[.-]|[^a-zA-Z0-9_-])+/g, "_");
 };
 
+/**
+ * @callback ReplacerFunction
+ * @param {string} match
+ * @param {string | undefined} arg
+ * @param {string} input
+ */
+
+/**
+ * @param {ReplacerFunction} replacer replacer
+ * @param {((arg0: number) => string) | undefined} handler handler
+ * @param {AssetInfo | undefined} assetInfo asset info
+ * @param {string} hashName hash name
+ * @returns {ReplacerFunction} hash replacer function
+ */
 const hashLength = (replacer, handler, assetInfo, hashName) => {
+	/** @type {ReplacerFunction} */
 	const fn = (match, arg, input) => {
 		let result;
 		const length = arg && parseInt(arg, 10);
@@ -58,7 +80,15 @@ const hashLength = (replacer, handler, assetInfo, hashName) => {
 	return fn;
 };
 
+/** @typedef {(match: string, arg?: string, input?: string) => string} Replacer */
+
+/**
+ * @param {string | number | null | undefined | (() => string | number | null | undefined)} value value
+ * @param {boolean=} allowEmpty allow empty
+ * @returns {Replacer} replacer
+ */
 const replacer = (value, allowEmpty) => {
+	/** @type {Replacer} */
 	const fn = (match, arg, input) => {
 		if (typeof value === "function") {
 			value = value();
@@ -81,6 +111,12 @@ const replacer = (value, allowEmpty) => {
 
 const deprecationCache = new Map();
 const deprecatedFunction = (() => () => {})();
+/**
+ * @param {Function} fn function
+ * @param {string} message message
+ * @param {string} code code
+ * @returns {function(...any[]): void} function with deprecation output
+ */
 const deprecated = (fn, message, code) => {
 	let d = deprecationCache.get(message);
 	if (d === undefined) {
@@ -96,7 +132,7 @@ const deprecated = (fn, message, code) => {
 /**
  * @param {string | function(PathData, AssetInfo=): string} path the raw path
  * @param {PathData} data context data
- * @param {AssetInfo} assetInfo extra info about the asset (will be written to)
+ * @param {AssetInfo | undefined} assetInfo extra info about the asset (will be written to)
  * @returns {string} the interpolated path
  */
 const replacePathVariables = (path, data, assetInfo) => {
@@ -227,7 +263,7 @@ const replacePathVariables = (path, data, assetInfo) => {
 			),
 			data.contentHashWithLength ||
 				("contentHashWithLength" in chunk && chunk.contentHashWithLength
-					? chunk.contentHashWithLength[contentHashType]
+					? chunk.contentHashWithLength[/** @type {string} */ (contentHashType)]
 					: undefined),
 			assetInfo,
 			"contenthash"
@@ -255,13 +291,18 @@ const replacePathVariables = (path, data, assetInfo) => {
 
 		const idReplacer = replacer(() =>
 			prepareId(
-				module instanceof Module ? chunkGraph.getModuleId(module) : module.id
+				module instanceof Module
+					? /** @type {ChunkGraph} */ (chunkGraph).getModuleId(module)
+					: module.id
 			)
 		);
 		const moduleHashReplacer = hashLength(
 			replacer(() =>
 				module instanceof Module
-					? chunkGraph.getRenderedModuleHash(module, data.runtime)
+					? /** @type {ChunkGraph} */ (chunkGraph).getRenderedModuleHash(
+							module,
+							data.runtime
+						)
 					: module.hash
 			),
 			"hashWithLength" in module ? module.hashWithLength : undefined,
@@ -269,7 +310,7 @@ const replacePathVariables = (path, data, assetInfo) => {
 			"modulehash"
 		);
 		const contentHashReplacer = hashLength(
-			replacer(data.contentHash),
+			replacer(/** @type {string} */ (data.contentHash)),
 			undefined,
 			assetInfo,
 			"contenthash"
@@ -300,7 +341,7 @@ const replacePathVariables = (path, data, assetInfo) => {
 	if (typeof data.runtime === "string") {
 		replacements.set(
 			"runtime",
-			replacer(() => prepareId(data.runtime))
+			replacer(() => prepareId(/** @type {string} */ (data.runtime)))
 		);
 	} else {
 		replacements.set("runtime", replacer("_"));

package/lib/Watching.js

@@ -13,11 +13,12 @@ const Stats = require("./Stats");
 /** @typedef {import("./FileSystemInfo").FileSystemInfoEntry} FileSystemInfoEntry */
 /** @typedef {import("./WebpackError")} WebpackError */
 /** @typedef {import("./logging/Logger").Logger} Logger */
+/** @typedef {import("./util/fs").WatchFileSystem} WatchFileSystem */
 
 /**
  * @template T
  * @callback Callback
- * @param {(Error | null)=} err
+ * @param {Error | null} err
  * @param {T=} result
  */
 
@@ -171,8 +172,16 @@ class Watching {
 			this._invalidReported = false;
 			this.compiler.hooks.watchRun.callAsync(this.compiler, err => {
 				if (err) return this._done(err);
-				const onCompiled = (err, compilation) => {
-					if (err) return this._done(err, compilation);
+				/**
+				 * @param {Error | null} err error
+				 * @param {Compilation=} _compilation compilation
+				 * @returns {void}
+				 */
+				const onCompiled = (err, _compilation) => {
+					if (err) return this._done(err, _compilation);
+
+					const compilation = /** @type {Compilation} */ (_compilation);
+
 					if (this.invalid) return this._done(null, compilation);
 
 					if (this.compiler.hooks.shouldEmit.call(compilation) === false) {
@@ -195,7 +204,9 @@ class Watching {
 								if (compilation.hooks.needAdditionalPass.call()) {
 									compilation.needAdditionalPass = true;
 
-									compilation.startTime = this.startTime;
+									compilation.startTime = /** @type {number} */ (
+										this.startTime
+									);
 									compilation.endTime = Date.now();
 									logger.time("done hook");
 									const stats = new Stats(compilation);
@@ -239,10 +250,12 @@ class Watching {
 	_done(err, compilation) {
 		this.running = false;
 
-		const logger = compilation && compilation.getLogger("webpack.Watching");
+		const logger =
+			/** @type {Logger} */
+			(compilation && compilation.getLogger("webpack.Watching"));
 
-		/** @type {Stats | null} */
-		let stats = null;
+		/** @type {Stats | undefined} */
+		let stats = undefined;
 
 		/**
 		 * @param {Error} err error
@@ -267,13 +280,11 @@ class Watching {
 			!(this._isBlocked() && (this.blocked = true))
 		) {
 			if (compilation) {
-				/** @type {Logger} */
-				(logger).time("storeBuildDependencies");
+				logger.time("storeBuildDependencies");
 				this.compiler.cache.storeBuildDependencies(
 					compilation.buildDependencies,
 					err => {
-						/** @type {Logger} */
-						(logger).timeEnd("storeBuildDependencies");
+						logger.timeEnd("storeBuildDependencies");
 						if (err) return handleError(err);
 						this._go();
 					}
@@ -285,7 +296,7 @@ class Watching {
 		}
 
 		if (compilation) {
-			compilation.startTime = this.startTime;
+			compilation.startTime = /** @type {number} */ (this.startTime);
 			compilation.endTime = Date.now();
 			stats = new Stats(compilation);
 		}
@@ -294,28 +305,22 @@ class Watching {
 
 		const cbs = this.callbacks;
 		this.callbacks = [];
-		/** @type {Logger} */
-		(logger).time("done hook");
+		logger.time("done hook");
 		this.compiler.hooks.done.callAsync(/** @type {Stats} */ (stats), err => {
-			/** @type {Logger} */
-			(logger).timeEnd("done hook");
+			logger.timeEnd("done hook");
 			if (err) return handleError(err, cbs);
-			this.handler(null, /** @type {Stats} */ (stats));
-			/** @type {Logger} */
-			(logger).time("storeBuildDependencies");
+			this.handler(null, stats);
+			logger.time("storeBuildDependencies");
 			this.compiler.cache.storeBuildDependencies(
 				/** @type {Compilation} */
 				(compilation).buildDependencies,
 				err => {
-					/** @type {Logger} */
-					(logger).timeEnd("storeBuildDependencies");
+					logger.timeEnd("storeBuildDependencies");
 					if (err) return handleError(err, cbs);
-					/** @type {Logger} */
-					(logger).time("beginIdle");
+					logger.time("beginIdle");
 					this.compiler.cache.beginIdle();
 					this.compiler.idle = true;
-					/** @type {Logger} */
-					(logger).timeEnd("beginIdle");
+					logger.timeEnd("beginIdle");
 					process.nextTick(() => {
 						if (!this.closed) {
 							this.watch(
@@ -343,43 +348,45 @@ class Watching {
 	 */
 	watch(files, dirs, missing) {
 		this.pausedWatcher = null;
-		this.watcher = this.compiler.watchFileSystem.watch(
-			files,
-			dirs,
-			missing,
-			this.lastWatcherStartTime,
-			this.watchOptions,
-			(
-				err,
-				fileTimeInfoEntries,
-				contextTimeInfoEntries,
-				changedFiles,
-				removedFiles
-			) => {
-				if (err) {
-					this.compiler.modifiedFiles = undefined;
-					this.compiler.removedFiles = undefined;
-					this.compiler.fileTimestamps = undefined;
-					this.compiler.contextTimestamps = undefined;
-					this.compiler.fsStartTime = undefined;
-					return this.handler(err);
-				}
-				this._invalidate(
+		this.watcher =
+			/** @type {WatchFileSystem} */
+			(this.compiler.watchFileSystem).watch(
+				files,
+				dirs,
+				missing,
+				/** @type {number} */ (this.lastWatcherStartTime),
+				this.watchOptions,
+				(
+					err,
 					fileTimeInfoEntries,
 					contextTimeInfoEntries,
 					changedFiles,
 					removedFiles
-				);
-				this._onChange();
-			},
-			(fileName, changeTime) => {
-				if (!this._invalidReported) {
-					this._invalidReported = true;
-					this.compiler.hooks.invalid.call(fileName, changeTime);
+				) => {
+					if (err) {
+						this.compiler.modifiedFiles = undefined;
+						this.compiler.removedFiles = undefined;
+						this.compiler.fileTimestamps = undefined;
+						this.compiler.contextTimestamps = undefined;
+						this.compiler.fsStartTime = undefined;
+						return this.handler(err);
+					}
+					this._invalidate(
+						fileTimeInfoEntries,
+						contextTimeInfoEntries,
+						changedFiles,
+						removedFiles
+					);
+					this._onChange();
+				},
+				(fileName, changeTime) => {
+					if (!this._invalidReported) {
+						this._invalidReported = true;
+						this.compiler.hooks.invalid.call(fileName, changeTime);
+					}
+					this._onInvalid();
 				}
-				this._onInvalid();
-			}
-		);
+			);
 	}
 
 	/**
@@ -452,7 +459,7 @@ class Watching {
 			return;
 		}
 		/**
-		 * @param {(WebpackError | null)=} err error if any
+		 * @param {WebpackError | null} err error if any
 		 * @param {Compilation=} compilation compilation if any
 		 */
 		const finalCallback = (err, compilation) => {
@@ -466,7 +473,7 @@ class Watching {
 			this.compiler.contextTimestamps = undefined;
 			this.compiler.fsStartTime = undefined;
 			/**
-			 * @param {(WebpackError | null)=} err error if any
+			 * @param {WebpackError | null} err error if any
 			 */
 			const shutdown = err => {
 				this.compiler.hooks.watchClose.call();
@@ -508,7 +515,7 @@ class Watching {
 			this.invalid = true;
 			this._done = finalCallback;
 		} else {
-			finalCallback();
+			finalCallback(null);
 		}
 	}
 }

package/lib/WebpackError.js

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

package/lib/WebpackOptionsApply.js

@@ -57,6 +57,8 @@ const { cleverMerge } = require("./util/cleverMerge");
 
 /** @typedef {import("../declarations/WebpackOptions").WebpackOptionsNormalized} WebpackOptions */
 /** @typedef {import("./Compiler")} Compiler */
+/** @typedef {import("./util/fs").InputFileSystem} InputFileSystem */
+/** @typedef {import("./util/fs").IntermediateFileSystem} IntermediateFileSystem */
 
 class WebpackOptionsApply extends OptionsApply {
 	constructor() {
@@ -455,7 +457,10 @@ class WebpackOptionsApply extends OptionsApply {
 		}
 		if (options.optimization.runtimeChunk) {
 			const RuntimeChunkPlugin = require("./optimize/RuntimeChunkPlugin");
-			new RuntimeChunkPlugin(options.optimization.runtimeChunk).apply(compiler);
+			new RuntimeChunkPlugin(
+				/** @type {{ name?: (entrypoint: { name: string }) => string }} */
+				(options.optimization.runtimeChunk)
+			).apply(compiler);
 		}
 		if (!options.optimization.emitOnErrors) {
 			const NoEmitOnErrorsPlugin = require("./NoEmitOnErrorsPlugin");
@@ -649,7 +654,9 @@ class WebpackOptionsApply extends OptionsApply {
 							new IdleFileCachePlugin(
 								new PackFileCacheStrategy({
 									compiler,
-									fs: compiler.intermediateFileSystem,
+									fs: /** @type {IntermediateFileSystem} */ (
+										compiler.intermediateFileSystem
+									),
 									context: options.context,
 									cacheLocation: cacheOptions.cacheLocation,
 									version: cacheOptions.version,
@@ -694,14 +701,18 @@ class WebpackOptionsApply extends OptionsApply {
 			.for("normal")
 			.tap("WebpackOptionsApply", resolveOptions => {
 				resolveOptions = cleverMerge(options.resolve, resolveOptions);
-				resolveOptions.fileSystem = compiler.inputFileSystem;
+				resolveOptions.fileSystem =
+					/** @type {InputFileSystem} */
+					(compiler.inputFileSystem);
 				return resolveOptions;
 			});
 		compiler.resolverFactory.hooks.resolveOptions
 			.for("context")
 			.tap("WebpackOptionsApply", resolveOptions => {
 				resolveOptions = cleverMerge(options.resolve, resolveOptions);
-				resolveOptions.fileSystem = compiler.inputFileSystem;
+				resolveOptions.fileSystem =
+					/** @type {InputFileSystem} */
+					(compiler.inputFileSystem);
 				resolveOptions.resolveToContext = true;
 				return resolveOptions;
 			});
@@ -709,7 +720,9 @@ class WebpackOptionsApply extends OptionsApply {
 			.for("loader")
 			.tap("WebpackOptionsApply", resolveOptions => {
 				resolveOptions = cleverMerge(options.resolveLoader, resolveOptions);
-				resolveOptions.fileSystem = compiler.inputFileSystem;
+				resolveOptions.fileSystem =
+					/** @type {InputFileSystem} */
+					(compiler.inputFileSystem);
 				return resolveOptions;
 			});
 		compiler.hooks.afterResolvers.call(compiler);

package/lib/asset/AssetGenerator.js

@@ -12,6 +12,7 @@ const ConcatenationScope = require("../ConcatenationScope");
 const Generator = require("../Generator");
 const { ASSET_MODULE_TYPE } = require("../ModuleTypeConstants");
 const RuntimeGlobals = require("../RuntimeGlobals");
+const CssUrlDependency = require("../dependencies/CssUrlDependency");
 const createHash = require("../util/createHash");
 const { makePathsRelative } = require("../util/identifier");
 const nonNumericOnlyHash = require("../util/nonNumericOnlyHash");
@@ -321,6 +322,7 @@ class AssetGenerator extends Generator {
 							}
 						);
 					let assetPath;
+					let assetPathForCss;
 					if (this.publicPath !== undefined) {
 						const { path, info } =
 							runtimeTemplate.compilation.getAssetPathWithInfo(
@@ -335,12 +337,24 @@ class AssetGenerator extends Generator {
 							);
 						assetInfo = mergeAssetInfo(assetInfo, info);
 						assetPath = JSON.stringify(path + filename);
+						assetPathForCss = path + filename;
 					} else {
 						runtimeRequirements.add(RuntimeGlobals.publicPath); // add __webpack_require__.p
 						assetPath = runtimeTemplate.concatenation(
 							{ expr: RuntimeGlobals.publicPath },
 							filename
 						);
+						const compilation = runtimeTemplate.compilation;
+						const path =
+							compilation.outputOptions.publicPath === "auto"
+								? CssUrlDependency.PUBLIC_PATH_AUTO
+								: compilation.getAssetPath(
+										compilation.outputOptions.publicPath,
+										{
+											hash: compilation.hash
+										}
+									);
+						assetPathForCss = path + filename;
 					}
 					assetInfo = {
 						sourceFilename,
@@ -371,6 +385,7 @@ class AssetGenerator extends Generator {
 						data.set("fullContentHash", fullHash);
 						data.set("filename", filename);
 						data.set("assetInfo", assetInfo);
+						data.set("assetPathForCss", assetPathForCss);
 					}
 					content = assetPath;
 				}

package/lib/asset/RawDataUrlModule.js

@@ -71,7 +71,9 @@ class RawDataUrlModule extends Module {
 	 * @returns {string} a user readable identifier of the module
 	 */
 	readableIdentifier(requestShortener) {
-		return requestShortener.shorten(this.readableIdentifierStr);
+		return /** @type {string} */ (
+			requestShortener.shorten(this.readableIdentifierStr)
+		);
 	}
 
 	/**

package/lib/async-modules/AwaitDependenciesInitFragment.js

@@ -13,7 +13,7 @@ const Template = require("../Template");
 /** @typedef {import("../Generator").GenerateContext} GenerateContext */
 
 /**
- * @typedef {GenerateContext} Context
+ * @extends {InitFragment<GenerateContext>}
  */
 class AwaitDependenciesInitFragment extends InitFragment {
 	/**
@@ -43,7 +43,7 @@ class AwaitDependenciesInitFragment extends InitFragment {
 
 	/**
 	 * @param {GenerateContext} context context
-	 * @returns {string | Source} the source code that will be included as initialization code
+	 * @returns {string | Source | undefined} the source code that will be included as initialization code
 	 */
 	getContent({ runtimeRequirements }) {
 		runtimeRequirements.add(RuntimeGlobals.module);