webpack 5.106.1 → 5.107.0

package/lib/TemplatedPathPlugin.js

@@ -7,10 +7,12 @@
 
 const { basename, extname } = require("path");
 const util = require("util");
-const mime = require("mime-types");
 const Chunk = require("./Chunk");
 const Module = require("./Module");
 const { parseResource } = require("./util/identifier");
+const memoize = require("./util/memoize");
+
+const getMimeTypes = memoize(() => require("./util/mimeTypes"));
 
 /** @typedef {import("./ChunkGraph")} ChunkGraph */
 /** @typedef {import("./ChunkGraph").ModuleId} ModuleId */
@@ -36,6 +38,7 @@ const prepareId = (id) => {
 };
 
 /**
+ * Defines the replacer function callback.
  * @callback ReplacerFunction
  * @param {string} match
  * @param {string | undefined} arg
@@ -43,6 +46,7 @@ const prepareId = (id) => {
  */
 
 /**
+ * Returns hash replacer function.
  * @param {ReplacerFunction} replacer replacer
  * @param {((arg0: number) => string) | undefined} handler handler
  * @param {AssetInfo | undefined} assetInfo asset info
@@ -82,6 +86,7 @@ const hashLength = (replacer, handler, assetInfo, hashName) => {
 /** @typedef {(match: string, arg: string | undefined, input: string) => string} Replacer */
 
 /**
+ * Returns replacer.
  * @param {string | number | null | undefined | (() => string | number | null | undefined)} value value
  * @param {boolean=} allowEmpty allow empty
  * @returns {Replacer} replacer
@@ -112,6 +117,7 @@ const replacer = (value, allowEmpty) => {
 const deprecationCache = new Map();
 const deprecatedFunction = (() => () => {})();
 /**
+ * Returns function with deprecation output.
  * @template {(...args: EXPECTED_ANY[]) => EXPECTED_ANY} T
  * @param {T} fn function
  * @param {string} message message
@@ -136,6 +142,7 @@ const deprecated = (fn, message, code) => {
 /** @typedef {string | TemplatePathFn} TemplatePath */
 
 /**
+ * Returns the interpolated path.
  * @param {TemplatePath} path the raw path
  * @param {PathData} data context data
  * @param {AssetInfo=} assetInfo extra info about the asset (will be written to)
@@ -163,7 +170,7 @@ const interpolate = (path, data, assetInfo) => {
 		// check that filename is data uri
 		const match = data.filename.match(/^data:([^;,]+)/);
 		if (match) {
-			const ext = mime.extension(match[1]);
+			const ext = getMimeTypes().extension(match[1]);
 			const emptyReplacer = replacer("", true);
 			// "XXXX" used for `updateHash`, so we don't need it here
 			const contentHash =
@@ -386,7 +393,7 @@ const plugin = "TemplatedPathPlugin";
 
 class TemplatedPathPlugin {
 	/**
-	 * Apply the plugin
+	 * Applies the plugin by registering its hooks on the compiler.
 	 * @param {Compiler} compiler the compiler instance
 	 * @returns {void}
 	 */

package/lib/UseStrictPlugin.js

@@ -23,7 +23,7 @@ const PLUGIN_NAME = "UseStrictPlugin";
 
 class UseStrictPlugin {
 	/**
-	 * Apply the plugin
+	 * Applies the plugin by registering its hooks on the compiler.
 	 * @param {Compiler} compiler the compiler instance
 	 * @returns {void}
 	 */
@@ -32,6 +32,7 @@ class UseStrictPlugin {
 			PLUGIN_NAME,
 			(compilation, { normalModuleFactory }) => {
 				/**
+				 * Handles the hook callback for this code path.
 				 * @param {JavascriptParser} parser the parser
 				 * @param {JavascriptParserOptions} parserOptions the javascript parser options
 				 */

package/lib/WarnCaseSensitiveModulesPlugin.js

@@ -5,17 +5,85 @@
 
 "use strict";
 
-const CaseSensitiveModulesWarning = require("./CaseSensitiveModulesWarning");
-
 /** @typedef {import("./Compiler")} Compiler */
 /** @typedef {import("./Module")} Module */
+/** @typedef {import("./ModuleGraph")} ModuleGraph */
 /** @typedef {import("./NormalModule")} NormalModule */
 
+const WebpackError = require("./errors/WebpackError");
+
+/**
+ * Sorts the conflicting modules by identifier to keep warning output stable.
+ * @param {Module[]} modules the modules to be sorted
+ * @returns {Module[]} sorted version of original modules
+ */
+const sortModules = (modules) =>
+	modules.sort((a, b) => {
+		const aIdent = a.identifier();
+		const bIdent = b.identifier();
+		/* istanbul ignore next */
+		if (aIdent < bIdent) return -1;
+		/* istanbul ignore next */
+		if (aIdent > bIdent) return 1;
+		/* istanbul ignore next */
+		return 0;
+	});
+
+/**
+ * Formats the conflicting modules and one representative incoming reason for
+ * each module into the warning body.
+ * @param {Module[]} modules each module from throw
+ * @param {ModuleGraph} moduleGraph the module graph
+ * @returns {string} each message from provided modules
+ */
+const createModulesListMessage = (modules, moduleGraph) =>
+	modules
+		.map((m) => {
+			let message = `* ${m.identifier()}`;
+			const validReasons = [
+				...moduleGraph.getIncomingConnectionsByOriginModule(m).keys()
+			].filter(Boolean);
+
+			if (validReasons.length > 0) {
+				message += `\n    Used by ${validReasons.length} module(s), i. e.`;
+				message += `\n    ${
+					/** @type {Module[]} */ (validReasons)[0].identifier()
+				}`;
+			}
+			return message;
+		})
+		.join("\n");
+
+/**
+ * Warning emitted when webpack finds modules whose identifiers differ only by
+ * letter casing, which can behave inconsistently across filesystems.
+ */
+class CaseSensitiveModulesWarning extends WebpackError {
+	/**
+	 * Builds a warning message that lists the case-conflicting modules and
+	 * representative importers that caused them to be included.
+	 * @param {Iterable<Module>} modules modules that were detected
+	 * @param {ModuleGraph} moduleGraph the module graph
+	 */
+	constructor(modules, moduleGraph) {
+		const sortedModules = sortModules([...modules]);
+		const modulesList = createModulesListMessage(sortedModules, moduleGraph);
+		super(`There are multiple modules with names that only differ in casing.
+This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
+Use equal casing. Compare these module identifiers:
+${modulesList}`);
+
+		/** @type {string} */
+		this.name = "CaseSensitiveModulesWarning";
+		this.module = sortedModules[0];
+	}
+}
+
 const PLUGIN_NAME = "WarnCaseSensitiveModulesPlugin";
 
 class WarnCaseSensitiveModulesPlugin {
 	/**
-	 * Apply the plugin
+	 * Applies the plugin by registering its hooks on the compiler.
 	 * @param {Compiler} compiler the compiler instance
 	 * @returns {void}
 	 */

package/lib/WarnDeprecatedOptionPlugin.js

@@ -5,7 +5,7 @@
 
 "use strict";
 
-const WebpackError = require("./WebpackError");
+const WebpackError = require("./errors/WebpackError");
 
 /** @typedef {import("./Compiler")} Compiler */
 
@@ -25,7 +25,7 @@ class WarnDeprecatedOptionPlugin {
 	}
 
 	/**
-	 * Apply the plugin
+	 * Applies the plugin by registering its hooks on the compiler.
 	 * @param {Compiler} compiler the compiler instance
 	 * @returns {void}
 	 */

package/lib/WarnNoModeSetPlugin.js

@@ -5,7 +5,22 @@
 
 "use strict";
 
-const NoModeWarning = require("./NoModeWarning");
+const WebpackError = require("./errors/WebpackError");
+
+class NoModeWarning extends WebpackError {
+	constructor() {
+		super();
+
+		/** @type {string} */
+		this.name = "NoModeWarning";
+		this.message =
+			"configuration\n" +
+			"The 'mode' option has not been set, webpack will fallback to 'production' for this value.\n" +
+			"Set 'mode' option to 'development' or 'production' to enable defaults for each environment.\n" +
+			"You can also set it to 'none' to disable any default behavior. " +
+			"Learn more: https://webpack.js.org/configuration/mode/";
+	}
+}
 
 /** @typedef {import("./Compiler")} Compiler */
 
@@ -13,7 +28,7 @@ const PLUGIN_NAME = "WarnNoModeSetPlugin";
 
 class WarnNoModeSetPlugin {
 	/**
-	 * Apply the plugin
+	 * Applies the plugin by registering its hooks on the compiler.
 	 * @param {Compiler} compiler the compiler instance
 	 * @returns {void}
 	 */

package/lib/WatchIgnorePlugin.js

@@ -18,6 +18,7 @@ const IGNORE_TIME_ENTRY = "ignore";
 
 class IgnoringWatchFileSystem {
 	/**
+	 * Creates an instance of IgnoringWatchFileSystem.
 	 * @param {WatchFileSystem} wfs original file system
 	 * @param {WatchIgnorePluginOptions["paths"]} paths ignored paths
 	 */
@@ -31,6 +32,7 @@ class IgnoringWatchFileSystem {
 		files = [...files];
 		dirs = [...dirs];
 		/**
+		 * Returns true, if path is ignored.
 		 * @param {string} path path to check
 		 * @returns {boolean} true, if path is ignored
 		 */
@@ -119,6 +121,7 @@ const PLUGIN_NAME = "WatchIgnorePlugin";
 
 class WatchIgnorePlugin {
 	/**
+	 * Creates an instance of WatchIgnorePlugin.
 	 * @param {WatchIgnorePluginOptions} options options
 	 */
 	constructor(options) {
@@ -127,7 +130,7 @@ class WatchIgnorePlugin {
 	}
 
 	/**
-	 * Apply the plugin
+	 * Applies the plugin by registering its hooks on the compiler.
 	 * @param {Compiler} compiler the compiler instance
 	 * @returns {void}
 	 */

package/lib/Watching.js

@@ -11,13 +11,13 @@ const Stats = require("./Stats");
 /** @typedef {import("./Compilation")} Compilation */
 /** @typedef {import("./Compiler")} Compiler */
 /** @typedef {import("./Compiler").ErrorCallback} ErrorCallback */
-/** @typedef {import("./WebpackError")} WebpackError */
 /** @typedef {import("./logging/Logger").Logger} Logger */
 /** @typedef {import("./util/fs").TimeInfoEntries} TimeInfoEntries */
 /** @typedef {import("./util/fs").WatchFileSystem} WatchFileSystem */
 /** @typedef {import("./util/fs").Watcher} Watcher */
 
 /**
+ * Defines the callback type used by this module.
  * @template T
  * @template [R=void]
  * @typedef {import("./webpack").Callback<T, R>} Callback
@@ -27,6 +27,7 @@ const Stats = require("./Stats");
 
 class Watching {
 	/**
+	 * Creates an instance of Watching.
 	 * @param {Compiler} compiler the compiler
 	 * @param {WatchOptions} watchOptions options
 	 * @param {Callback<Stats>} handler completion handler
@@ -82,6 +83,7 @@ class Watching {
 	}
 
 	/**
+	 * Merge with collected.
 	 * @param {ReadonlySet<string> | undefined | null} changedFiles changed files
 	 * @param {ReadonlySet<string> | undefined | null} removedFiles removed files
 	 */
@@ -105,6 +107,7 @@ class Watching {
 	}
 
 	/**
+	 * Processes the provided file time info entries.
 	 * @param {TimeInfoEntries=} fileTimeInfoEntries info for files
 	 * @param {TimeInfoEntries=} contextTimeInfoEntries info for directories
 	 * @param {ReadonlySet<string>=} changedFiles changed files
@@ -183,6 +186,7 @@ class Watching {
 			this.compiler.hooks.watchRun.callAsync(this.compiler, (err) => {
 				if (err) return this._done(err);
 				/**
+				 * Processes the provided err.
 				 * @param {Error | null} err error
 				 * @param {Compilation=} _compilation compilation
 				 * @returns {void}
@@ -242,6 +246,7 @@ class Watching {
 	}
 
 	/**
+	 * Returns the compilation stats.
 	 * @param {Compilation} compilation the compilation
 	 * @returns {Stats} the compilation stats
 	 */
@@ -251,6 +256,7 @@ class Watching {
 	}
 
 	/**
+	 * Processes the provided err.
 	 * @param {(Error | null)=} err an optional error
 	 * @param {Compilation=} compilation the compilation
 	 * @returns {void}
@@ -266,6 +272,7 @@ class Watching {
 		let stats;
 
 		/**
+		 * Processes the provided err.
 		 * @param {Error} err error
 		 * @param {ErrorCallback[]=} cbs callbacks
 		 */
@@ -349,6 +356,7 @@ class Watching {
 	}
 
 	/**
+	 * Processes the provided file.
 	 * @param {Iterable<string>} files watched files
 	 * @param {Iterable<string>} dirs watched directories
 	 * @param {Iterable<string>} missing watched existence entries
@@ -398,6 +406,7 @@ class Watching {
 	}
 
 	/**
+	 * Processes the provided error callback.
 	 * @param {ErrorCallback=} callback signals when the build has completed again
 	 * @returns {void}
 	 */
@@ -414,6 +423,7 @@ class Watching {
 	}
 
 	/**
+	 * Processes the provided file time info entries.
 	 * @param {TimeInfoEntries=} fileTimeInfoEntries info for files
 	 * @param {TimeInfoEntries=} contextTimeInfoEntries info for directories
 	 * @param {ReadonlySet<string>=} changedFiles changed files
@@ -456,6 +466,7 @@ class Watching {
 	}
 
 	/**
+	 * Processes the provided error callback.
 	 * @param {ErrorCallback} callback signals when the watcher is closed
 	 * @returns {void}
 	 */
@@ -467,7 +478,8 @@ class Watching {
 			return;
 		}
 		/**
-		 * @param {WebpackError | null} err error if any
+		 * Processes the provided err.
+		 * @param {Error | null} err error if any
 		 * @param {Compilation=} compilation compilation if any
 		 */
 		const finalCallback = (err, compilation) => {
@@ -481,7 +493,8 @@ class Watching {
 			this.compiler.contextTimestamps = undefined;
 			this.compiler.fsStartTime = undefined;
 			/**
-			 * @param {WebpackError | null} err error if any
+			 * Processes the provided err.
+			 * @param {Error | null} err error if any
 			 */
 			const shutdown = (err) => {
 				this.compiler.hooks.watchClose.call();

package/lib/WebpackError.js

@@ -5,77 +5,6 @@
 
 "use strict";
 
-const inspect = require("util").inspect.custom;
-const makeSerializable = require("./util/makeSerializable");
-
-/** @typedef {import("./Chunk")} Chunk */
-/** @typedef {import("./Dependency").DependencyLocation} DependencyLocation */
-/** @typedef {import("./Module")} Module */
-/** @typedef {import("./serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
-/** @typedef {import("./serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */
-
-class WebpackError extends Error {
-	/**
-	 * Creates an instance of WebpackError.
-	 * @param {string=} message error message
-	 * @param {{ cause?: unknown }} options error options
-	 */
-	constructor(message, options = {}) {
-		super(message, options);
-
-		/** @type {string=} */
-		this.details = undefined;
-		/** @type {(Module | null)=} */
-		this.module = undefined;
-		/** @type {DependencyLocation=} */
-		this.loc = undefined;
-		/** @type {boolean=} */
-		this.hideStack = undefined;
-		/** @type {Chunk=} */
-		this.chunk = undefined;
-		/** @type {string=} */
-		this.file = undefined;
-	}
-
-	/**
-	 * @returns {string} inspect message
-	 */
-	[inspect]() {
-		return (
-			this.stack +
-			(this.details ? `\n${this.details}` : "") +
-			(this.cause ? `\n${this.cause}` : "")
-		);
-	}
-
-	/**
-	 * @param {ObjectSerializerContext} context context
-	 */
-	serialize({ write }) {
-		write(this.name);
-		write(this.message);
-		write(this.stack);
-		write(this.cause);
-		write(this.details);
-		write(this.loc);
-		write(this.hideStack);
-	}
-
-	/**
-	 * @param {ObjectDeserializerContext} context context
-	 */
-	deserialize({ read }) {
-		this.name = read();
-		this.message = read();
-		this.stack = read();
-		this.cause = read();
-		this.details = read();
-		this.loc = read();
-		this.hideStack = read();
-	}
-}
-
-makeSerializable(WebpackError, "webpack/lib/WebpackError");
-
-/** @type {typeof WebpackError} */
-module.exports = WebpackError;
+// TODO remove in webpack 6
+// Some old plugins use `require("webpack/lib/WebpackError")`, in webpack@6 developer should migrate to `compiler.webpack.WebpackError`
+module.exports = require("./errors/WebpackError");

package/lib/WebpackIsIncludedPlugin.js

@@ -5,13 +5,13 @@
 
 "use strict";
 
-const IgnoreErrorModuleFactory = require("./IgnoreErrorModuleFactory");
 const {
 	JAVASCRIPT_MODULE_TYPE_AUTO,
 	JAVASCRIPT_MODULE_TYPE_DYNAMIC,
 	JAVASCRIPT_MODULE_TYPE_ESM
 } = require("./ModuleTypeConstants");
 const WebpackIsIncludedDependency = require("./dependencies/WebpackIsIncludedDependency");
+const IgnoreErrorModuleFactory = require("./errors/IgnoreErrorModuleFactory");
 const {
 	toConstantDependency
 } = require("./javascript/JavascriptParserHelpers");
@@ -25,6 +25,7 @@ const PLUGIN_NAME = "WebpackIsIncludedPlugin";
 
 class WebpackIsIncludedPlugin {
 	/**
+	 * Applies the plugin by registering its hooks on the compiler.
 	 * @param {Compiler} compiler the compiler instance
 	 * @returns {void}
 	 */
@@ -42,6 +43,7 @@ class WebpackIsIncludedPlugin {
 				);
 
 				/**
+				 * Handles the hook callback for this code path.
 				 * @param {JavascriptParser} parser the parser
 				 * @returns {void}
 				 */

package/lib/WebpackOptionsApply.js

@@ -90,6 +90,7 @@ class WebpackOptionsApply extends OptionsApply {
 	}
 
 	/**
+	 * Returns options object.
 	 * @param {WebpackOptions} options options object
 	 * @param {Compiler} compiler compiler object
 	 * @param {WebpackOptionsInterception=} interception intercepted options
@@ -424,6 +425,18 @@ class WebpackOptionsApply extends OptionsApply {
 			new CssModulesPlugin().apply(compiler);
 		}
 
+		if (options.experiments.html) {
+			const HtmlModulesPlugin = require("./html/HtmlModulesPlugin");
+
+			new HtmlModulesPlugin().apply(compiler);
+		}
+
+		if (options.experiments.typescript) {
+			const TypeScriptPlugin = require("./typescript/TypeScriptPlugin");
+
+			new TypeScriptPlugin().apply(compiler);
+		}
+
 		if (options.experiments.lazyCompilation) {
 			const LazyCompilationPlugin = require("./hmr/LazyCompilationPlugin");
 
@@ -516,7 +529,7 @@ class WebpackOptionsApply extends OptionsApply {
 		}).apply(compiler);
 		if (options.amd !== false) {
 			const AMDPlugin = require("./dependencies/AMDPlugin");
-			const RequireJsStuffPlugin = require("./RequireJsStuffPlugin");
+			const RequireJsStuffPlugin = require("./dependencies/RequireJsStuffPlugin");
 
 			new AMDPlugin(options.amd || {}).apply(compiler);
 			new RequireJsStuffPlugin().apply(compiler);

package/lib/WebpackOptionsDefaulter.js

@@ -13,6 +13,7 @@ const { getNormalizedWebpackOptions } = require("./config/normalization");
 
 class WebpackOptionsDefaulter {
 	/**
+	 * Returns normalized webpack options.
 	 * @param {WebpackOptions} options webpack options
 	 * @returns {WebpackOptionsNormalized} normalized webpack options
 	 */

package/lib/asset/AssetBytesGenerator.js

@@ -12,6 +12,7 @@ const {
 	CSS_TYPE,
 	CSS_URL_TYPE,
 	CSS_URL_TYPES,
+	HTML_TYPE,
 	JAVASCRIPT_AND_CSS_URL_TYPES,
 	JAVASCRIPT_TYPE,
 	JAVASCRIPT_TYPES,
@@ -29,6 +30,7 @@ const RuntimeGlobals = require("../RuntimeGlobals");
 
 class AssetSourceGenerator extends Generator {
 	/**
+	 * Creates an instance of AssetSourceGenerator.
 	 * @param {ModuleGraph} moduleGraph the module graph
 	 */
 	constructor(moduleGraph) {
@@ -38,6 +40,7 @@ class AssetSourceGenerator extends Generator {
 	}
 
 	/**
+	 * Generates generated code for this runtime module.
 	 * @param {NormalModule} module module for which the code should be generated
 	 * @param {GenerateContext} generateContext context for generate
 	 * @returns {Source | null} generated code
@@ -97,6 +100,7 @@ class AssetSourceGenerator extends Generator {
 	}
 
 	/**
+	 * Generates fallback output for the provided error condition.
 	 * @param {Error} error the error
 	 * @param {NormalModule} module module for which the code should be generated
 	 * @param {GenerateContext} generateContext context for generate
@@ -115,6 +119,7 @@ class AssetSourceGenerator extends Generator {
 	}
 
 	/**
+	 * Returns the reason this module cannot be concatenated, when one exists.
 	 * @param {NormalModule} module module for which the bailout reason should be determined
 	 * @param {ConcatenationBailoutReasonContext} context context
 	 * @returns {string | undefined} reason why this module can't be concatenated, undefined when it can be concatenated
@@ -124,6 +129,7 @@ class AssetSourceGenerator extends Generator {
 	}
 
 	/**
+	 * Returns the source types available for this module.
 	 * @param {NormalModule} module fresh module
 	 * @returns {SourceTypes} available types (do not mutate)
 	 */
@@ -141,9 +147,12 @@ class AssetSourceGenerator extends Generator {
 		}
 
 		if (sourceTypes.size > 0) {
-			if (sourceTypes.has(JAVASCRIPT_TYPE) && sourceTypes.has(CSS_TYPE)) {
+			if (
+				sourceTypes.has(JAVASCRIPT_TYPE) &&
+				(sourceTypes.has(CSS_TYPE) || sourceTypes.has(HTML_TYPE))
+			) {
 				return JAVASCRIPT_AND_CSS_URL_TYPES;
-			} else if (sourceTypes.has(CSS_TYPE)) {
+			} else if (sourceTypes.has(CSS_TYPE) || sourceTypes.has(HTML_TYPE)) {
 				return CSS_URL_TYPES;
 			}
 			return JAVASCRIPT_TYPES;
@@ -153,6 +162,7 @@ class AssetSourceGenerator extends Generator {
 	}
 
 	/**
+	 * Returns the estimated size for the requested source type.
 	 * @param {NormalModule} module the module
 	 * @param {SourceType=} type source type
 	 * @returns {number} estimate size of the module

package/lib/asset/AssetBytesParser.js

@@ -14,6 +14,7 @@ const Parser = require("../Parser");
 
 class AssetBytesParser extends Parser {
 	/**
+	 * Parses the provided source and updates the parser state.
 	 * @param {string | Buffer | PreparsedAst} source the source to parse
 	 * @param {ParserState} state the parser state
 	 * @returns {ParserState} the parser state