webpack 5.100.2 → 5.101.0

package/README.md

@@ -133,16 +133,6 @@ loaders](https://webpack.js.org/api/loaders/) using Node.js.
 Loaders are activated by using `loadername!` prefixes in `require()` statements,
 or are automatically applied via regex from your webpack configuration.
 
-#### Files
-
-|       Name        |   Status   | Install Size | Description                                              |
-| :---------------: | :--------: | :----------: | :------------------------------------------------------- |
-| [val-loader][val] | ![val-npm] | ![val-size]  | Executes code as module and considers exports as JS code |
-
-[val]: https://github.com/webpack-contrib/val-loader
-[val-npm]: https://img.shields.io/npm/v/val-loader.svg
-[val-size]: https://packagephobia.com/badge?p=val-loader
-
 #### JSON
 
 |                                                                   Name                                                                    |   Status    | Install Size |           Description            |
@@ -262,6 +252,18 @@ you full control of what is loaded initially and what is loaded at runtime
 through code splitting. It can also make your code chunks **cache
 friendly** by using hashes.
 
+### Developer Tools
+
+If you're working on webpack itself, or building advanced plugins or integrations, the tools below can help you explore internal mechanics, debug plugin life-cycles, and build custom tooling.
+
+#### Instrumentation
+
+| Name                                                      | Status                | Description                                                                                                                       |
+| --------------------------------------------------------- | --------------------- | --------------------------------------------------------------------------------------------------------------------------------- |
+| [tapable-tracer](https://github.com/ertgl/tapable-tracer) | ![tapable-tracer-npm] | Traces tapable hook execution in real-time and collects structured stack frames. Can export to UML for generating visualizations. |
+
+[tapable-tracer-npm]: https://img.shields.io/npm/v/tapable-tracer.svg
+
 <h2>Contributing</h2>
 
 **We want contributing to webpack to be fun, enjoyable, and educational for anyone, and everyone.** We have a [vibrant ecosystem](https://medium.com/webpack/contributors-guide/home) that spans beyond this single repo. We welcome you to check out any of the repositories in [our organization](https://github.com/webpack) or [webpack-contrib organization](https://github.com/webpack-contrib) which houses all of our loaders and plugins.

package/bin/webpack.js

@@ -16,11 +16,11 @@ const runCommand = (command, args) => {
 			shell: true
 		});
 
-		executedCommand.on("error", error => {
+		executedCommand.on("error", (error) => {
 			reject(error);
 		});
 
-		executedCommand.on("exit", code => {
+		executedCommand.on("exit", (code) => {
 			if (code === 0) {
 				resolve();
 			} else {
@@ -34,7 +34,7 @@ const runCommand = (command, args) => {
  * @param {string} packageName name of the package
  * @returns {boolean} is the package installed?
  */
-const isInstalled = packageName => {
+const isInstalled = (packageName) => {
 	if (process.versions.pnp) {
 		return true;
 	}
@@ -76,7 +76,7 @@ const isInstalled = packageName => {
  * @param {CliOption} cli options
  * @returns {void}
  */
-const runCli = cli => {
+const runCli = (cli) => {
 	const path = require("path");
 
 	const pkgPath = require.resolve(`${cli.package}/package.json`);
@@ -85,7 +85,7 @@ const runCli = cli => {
 
 	if (pkg.type === "module" || /\.mjs/i.test(pkg.bin[cli.binName])) {
 		import(path.resolve(path.dirname(pkgPath), pkg.bin[cli.binName])).catch(
-			err => {
+			(err) => {
 				console.error(err);
 				process.exitCode = 1;
 			}
@@ -152,7 +152,7 @@ if (!cli.installed) {
 	// executed. Setting the exit code here to ensure the script exits correctly in those cases. The callback
 	// function is responsible for clearing the exit code if the user wishes to install webpack-cli.
 	process.exitCode = 1;
-	questionInterface.question(question, answer => {
+	questionInterface.question(question, (answer) => {
 		questionInterface.close();
 
 		const normalizedAnswer = answer.toLowerCase().startsWith("y");
@@ -183,7 +183,7 @@ if (!cli.installed) {
 			.then(() => {
 				runCli(cli);
 			})
-			.catch(err => {
+			.catch((err) => {
 				console.error(err);
 				process.exitCode = 1;
 			});

package/lib/APIPlugin.js

@@ -169,7 +169,7 @@ class APIPlugin {
 
 				compilation.hooks.runtimeRequirementInTree
 					.for(RuntimeGlobals.chunkName)
-					.tap(PLUGIN_NAME, chunk => {
+					.tap(PLUGIN_NAME, (chunk) => {
 						compilation.addRuntimeModule(
 							chunk,
 							new ChunkNameRuntimeModule(/** @type {string} */ (chunk.name))
@@ -190,13 +190,11 @@ class APIPlugin {
 					PLUGIN_NAME,
 					(source, module, renderContext) => {
 						if (/** @type {BuildInfo} */ (module.buildInfo).needCreateRequire) {
-							const needPrefix =
-								renderContext.runtimeTemplate.supportNodePrefixForCoreModules();
 							const chunkInitFragments = [
 								new InitFragment(
-									`import { createRequire as __WEBPACK_EXTERNAL_createRequire } from "${
-										needPrefix ? "node:" : ""
-									}module";\n`,
+									`import { createRequire as __WEBPACK_EXTERNAL_createRequire } from ${renderContext.runtimeTemplate.renderNodePrefixForCoreModule(
+										"module"
+									)};\n`,
 									InitFragment.STAGE_HARMONY_IMPORTS,
 									0,
 									"external module node-commonjs"
@@ -213,10 +211,10 @@ class APIPlugin {
 				/**
 				 * @param {JavascriptParser} parser the parser
 				 */
-				const handler = parser => {
+				const handler = (parser) => {
 					for (const key of Object.keys(REPLACEMENTS)) {
 						const info = REPLACEMENTS[key];
-						parser.hooks.expression.for(key).tap(PLUGIN_NAME, expression => {
+						parser.hooks.expression.for(key).tap(PLUGIN_NAME, (expression) => {
 							const dep = toConstantDependency(parser, info.expr, info.req);
 
 							if (key === "__non_webpack_require__" && this.options.module) {
@@ -227,7 +225,7 @@ class APIPlugin {
 							return dep(expression);
 						});
 						if (info.assign === false) {
-							parser.hooks.assign.for(key).tap(PLUGIN_NAME, expr => {
+							parser.hooks.assign.for(key).tap(PLUGIN_NAME, (expr) => {
 								const err = new WebpackError(`${key} must not be assigned`);
 								err.loc = /** @type {DependencyLocation} */ (expr.loc);
 								throw err;
@@ -242,7 +240,7 @@ class APIPlugin {
 
 					parser.hooks.expression
 						.for("__webpack_layer__")
-						.tap(PLUGIN_NAME, expr => {
+						.tap(PLUGIN_NAME, (expr) => {
 							const dep = new ConstDependency(
 								JSON.stringify(parser.state.module.layer),
 								/** @type {Range} */ (expr.range)
@@ -253,7 +251,7 @@ class APIPlugin {
 						});
 					parser.hooks.evaluateIdentifier
 						.for("__webpack_layer__")
-						.tap(PLUGIN_NAME, expr =>
+						.tap(PLUGIN_NAME, (expr) =>
 							(parser.state.module.layer === null
 								? new BasicEvaluatedExpression().setNull()
 								: new BasicEvaluatedExpression().setString(
@@ -263,7 +261,7 @@ class APIPlugin {
 						);
 					parser.hooks.evaluateTypeof
 						.for("__webpack_layer__")
-						.tap(PLUGIN_NAME, expr =>
+						.tap(PLUGIN_NAME, (expr) =>
 							new BasicEvaluatedExpression()
 								.setString(
 									parser.state.module.layer === null ? "object" : "string"
@@ -273,7 +271,7 @@ class APIPlugin {
 
 					parser.hooks.expression
 						.for("__webpack_module__.id")
-						.tap(PLUGIN_NAME, expr => {
+						.tap(PLUGIN_NAME, (expr) => {
 							/** @type {BuildInfo} */
 							(parser.state.module.buildInfo).moduleConcatenationBailout =
 								"__webpack_module__.id";
@@ -289,7 +287,7 @@ class APIPlugin {
 
 					parser.hooks.expression
 						.for("__webpack_module__")
-						.tap(PLUGIN_NAME, expr => {
+						.tap(PLUGIN_NAME, (expr) => {
 							/** @type {BuildInfo} */
 							(parser.state.module.buildInfo).moduleConcatenationBailout =
 								"__webpack_module__";

package/lib/AutomaticPrefetchPlugin.js

@@ -31,7 +31,7 @@ class AutomaticPrefetchPlugin {
 		);
 		/** @type {{context: string | null, request: string}[] | null} */
 		let lastModules = null;
-		compiler.hooks.afterCompile.tap(PLUGIN_NAME, compilation => {
+		compiler.hooks.afterCompile.tap(PLUGIN_NAME, (compilation) => {
 			lastModules = [];
 
 			for (const m of compilation.modules) {
@@ -54,7 +54,7 @@ class AutomaticPrefetchPlugin {
 						callback
 					);
 				},
-				err => {
+				(err) => {
 					lastModules = null;
 					callback(err);
 				}

package/lib/BannerPlugin.js

@@ -32,7 +32,7 @@ const validate = createSchemaValidation(
  * @param {string} str string to wrap
  * @returns {string} wrapped string
  */
-const wrapComment = str => {
+const wrapComment = (str) => {
 	if (!str.includes("\n")) {
 		return Template.toComment(str);
 	}
@@ -67,7 +67,7 @@ class BannerPlugin {
 			/** @type {BannerFunction} */
 			this.banner = this.options.raw
 				? getBanner
-				: /** @type {BannerFunction} */ data => wrapComment(getBanner(data));
+				: /** @type {BannerFunction} */ (data) => wrapComment(getBanner(data));
 		} else {
 			const banner = this.options.raw
 				? bannerOption
@@ -93,7 +93,7 @@ class BannerPlugin {
 		const stage =
 			this.options.stage || Compilation.PROCESS_ASSETS_STAGE_ADDITIONS;
 
-		compiler.hooks.compilation.tap(PLUGIN_NAME, compilation => {
+		compiler.hooks.compilation.tap(PLUGIN_NAME, (compilation) => {
 			compilation.hooks.processAssets.tap({ name: PLUGIN_NAME, stage }, () => {
 				for (const chunk of compilation.chunks) {
 					if (options.entryOnly && !chunk.canBeInitial()) {
@@ -114,7 +114,7 @@ class BannerPlugin {
 							data
 						);
 
-						compilation.updateAsset(file, old => {
+						compilation.updateAsset(file, (old) => {
 							const cached = cache.get(old);
 							if (!cached || cached.comment !== comment) {
 								const source = options.footer

package/lib/Cache.js

@@ -40,7 +40,7 @@ const {
  * @param {(err?: Error) => void} callback callback
  * @returns {(err?: Error) => void} callback
  */
-const needCalls = (times, callback) => err => {
+const needCalls = (times, callback) => (err) => {
 	if (--times === 0) {
 		return callback(err);
 	}

package/lib/CacheFacade.js

@@ -61,8 +61,8 @@ class MultiItemCache {
 		 * @param {number} i index
 		 * @returns {Promise<T>} promise with the data
 		 */
-		const next = i =>
-			this._items[i].getPromise().then(result => {
+		const next = (i) =>
+			this._items[i].getPromise().then((result) => {
 				if (result !== undefined) return result;
 				if (++i < this._items.length) return next(i);
 			});
@@ -89,7 +89,7 @@ class MultiItemCache {
 	 * @returns {Promise<void>} promise signals when the value is stored
 	 */
 	storePromise(data) {
-		return Promise.all(this._items.map(item => item.storePromise(data))).then(
+		return Promise.all(this._items.map((item) => item.storePromise(data))).then(
 			() => {}
 		);
 	}
@@ -149,7 +149,7 @@ class ItemCacheFacade {
 	 */
 	storePromise(data) {
 		return new Promise((resolve, reject) => {
-			this._cache.store(this._name, this._etag, data, err => {
+			this._cache.store(this._name, this._etag, data, (err) => {
 				if (err) {
 					reject(err);
 				} else {
@@ -171,7 +171,7 @@ class ItemCacheFacade {
 			if (cacheEntry !== undefined) return cacheEntry;
 			computer((err, result) => {
 				if (err) return callback(err);
-				this.store(result, err => {
+				this.store(result, (err) => {
 					if (err) return callback(err);
 					callback(null, result);
 				});
@@ -297,7 +297,7 @@ class CacheFacade {
 	 */
 	storePromise(identifier, etag, data) {
 		return new Promise((resolve, reject) => {
-			this._cache.store(`${this._name}|${identifier}`, etag, data, err => {
+			this._cache.store(`${this._name}|${identifier}`, etag, data, (err) => {
 				if (err) {
 					reject(err);
 				} else {
@@ -321,7 +321,7 @@ class CacheFacade {
 			if (cacheEntry !== undefined) return cacheEntry;
 			computer((err, result) => {
 				if (err) return callback(err);
-				this.store(identifier, etag, result, err => {
+				this.store(identifier, etag, result, (err) => {
 					if (err) return callback(err);
 					callback(null, result);
 				});

package/lib/CaseSensitiveModulesWarning.js

@@ -14,7 +14,7 @@ const WebpackError = require("./WebpackError");
  * @param {Module[]} modules the modules to be sorted
  * @returns {Module[]} sorted version of original modules
  */
-const sortModules = modules =>
+const sortModules = (modules) =>
 	modules.sort((a, b) => {
 		const aIdent = a.identifier();
 		const bIdent = b.identifier();
@@ -33,7 +33,7 @@ const sortModules = modules =>
  */
 const createModulesListMessage = (modules, moduleGraph) =>
 	modules
-		.map(m => {
+		.map((m) => {
 			let message = `* ${m.identifier()}`;
 			const validReasons = [
 				...moduleGraph.getIncomingConnectionsByOriginModule(m).keys()

package/lib/Chunk.js

@@ -583,7 +583,7 @@ class Chunk {
 		const chunks = new Set();
 
 		const initialChunks = intersect(
-			Array.from(this.groupsIterable, g => new Set(g.chunks))
+			Array.from(this.groupsIterable, (g) => new Set(g.chunks))
 		);
 
 		const initialQueue = new Set(this.groupsIterable);
@@ -672,7 +672,7 @@ class Chunk {
 		const queue = new Set();
 
 		const initialChunks = intersect(
-			Array.from(this.groupsIterable, g => new Set(g.chunks))
+			Array.from(this.groupsIterable, (g) => new Set(g.chunks))
 		);
 
 		for (const chunkGroup of this.groupsIterable) {
@@ -812,7 +812,7 @@ class Chunk {
 		 * @param {Chunk} chunk a chunk
 		 * @returns {void}
 		 */
-		const addChildIdsByOrdersToMap = chunk => {
+		const addChildIdsByOrdersToMap = (chunk) => {
 			const data = chunk.getChildIdsByOrders(chunkGraph, filterFn);
 			for (const key of Object.keys(data)) {
 				let chunkMap = chunkMaps[key];

package/lib/ChunkGraph.js

@@ -76,13 +76,13 @@ class ModuleHashInfo {
  * @param {SortableSet<T>} set the set
  * @returns {T[]} set as array
  */
-const getArray = set => [...set];
+const getArray = (set) => [...set];
 
 /**
  * @param {SortableSet<Chunk>} chunks the chunks
  * @returns {RuntimeSpecSet} runtimes
  */
-const getModuleRuntimes = chunks => {
+const getModuleRuntimes = (chunks) => {
 	const runtimes = new RuntimeSpecSet();
 	for (const chunk of chunks) {
 		runtimes.add(chunk.runtime);
@@ -94,7 +94,7 @@ const getModuleRuntimes = chunks => {
  * @param {WeakMap<Module, Set<string>> | undefined} sourceTypesByModule sourceTypesByModule
  * @returns {(set: SortableSet<Module>) => Map<string, SortableSet<Module>>} modules by source type
  */
-const modulesBySourceType = sourceTypesByModule => set => {
+const modulesBySourceType = (sourceTypesByModule) => (set) => {
 	/** @type {Map<string, SortableSet<Module>>} */
 	const map = new Map();
 	for (const module of set) {
@@ -136,10 +136,10 @@ const createOrderedArrayFunctionMap = new WeakMap();
  * @param {ModuleComparator} comparator comparator function
  * @returns {ModuleSetToArrayFunction} set as ordered array
  */
-const createOrderedArrayFunction = comparator => {
+const createOrderedArrayFunction = (comparator) => {
 	let fn = createOrderedArrayFunctionMap.get(comparator);
 	if (fn !== undefined) return fn;
-	fn = set => {
+	fn = (set) => {
 		set.sortWith(comparator);
 		return [...set];
 	};
@@ -151,7 +151,7 @@ const createOrderedArrayFunction = comparator => {
  * @param {Iterable<Module>} modules the modules to get the count/size of
  * @returns {number} the size of the modules
  */
-const getModulesSize = modules => {
+const getModulesSize = (modules) => {
 	let size = 0;
 	for (const module of modules) {
 		for (const type of module.getSourceTypes()) {
@@ -165,7 +165,7 @@ const getModulesSize = modules => {
  * @param {Iterable<Module>} modules the sortable Set to get the size of
  * @returns {Record<string, number>} the sizes of the modules
  */
-const getModulesSizes = modules => {
+const getModulesSizes = (modules) => {
 	const sizes = Object.create(null);
 	for (const module of modules) {
 		for (const type of module.getSourceTypes()) {
@@ -311,13 +311,13 @@ class ChunkGraph {
 	_getGraphRoots(set) {
 		const { moduleGraph } = this;
 		return [
-			...findGraphRoots(set, module => {
+			...findGraphRoots(set, (module) => {
 				/** @type {Set<Module>} */
 				const set = new Set();
 				/**
 				 * @param {Module} module module
 				 */
-				const addDependencies = module => {
+				const addDependencies = (module) => {
 					for (const connection of moduleGraph.getOutgoingConnections(module)) {
 						if (!connection.module) continue;
 						const activeState = connection.getActiveState(undefined);
@@ -1272,7 +1272,10 @@ class ChunkGraph {
 		const array = [...cgc.runtimeModules];
 		array.sort(
 			concatComparators(
-				compareSelect(r => /** @type {RuntimeModule} */ (r).stage, compareIds),
+				compareSelect(
+					(r) => /** @type {RuntimeModule} */ (r).stage,
+					compareIds
+				),
 				compareModulesByIdentifier
 			)
 		);
@@ -1401,7 +1404,7 @@ class ChunkGraph {
 				throw new Error(
 					`No unique hash info entry for unspecified runtime for ${module.identifier()} (existing runtimes: ${Array.from(
 						hashes.keys(),
-						r => runtimeToString(r)
+						(r) => runtimeToString(r)
 					).join(", ")}).
 Caller might not support runtime-dependent code generation (opt-out via optimization.usedExports: "global").`
 				);
@@ -1493,7 +1496,7 @@ Caller might not support runtime-dependent code generation (opt-out via optimiza
 			cgm.runtimeRequirements = map;
 			return;
 		}
-		runtimeRequirementsMap.update(runtime, runtimeRequirements => {
+		runtimeRequirementsMap.update(runtime, (runtimeRequirements) => {
 			if (runtimeRequirements === undefined) {
 				return transferOwnership ? items : new Set(items);
 			} else if (!transferOwnership || runtimeRequirements.size >= items.size) {
@@ -1623,7 +1626,7 @@ Caller might not support runtime-dependent code generation (opt-out via optimiza
 		 * @param {ConnectionState} state state
 		 * @returns {"F" | "T" | "O"} result
 		 */
-		const activeStateToString = state => {
+		const activeStateToString = (state) => {
 			if (state === false) return "F";
 			if (state === true) return "T";
 			if (state === ModuleGraphConnection.TRANSITIVE_ONLY) return "O";
@@ -1675,7 +1678,7 @@ Caller might not support runtime-dependent code generation (opt-out via optimiza
 					let stateInfo = "";
 					forEachRuntime(
 						runtime,
-						runtime => {
+						(runtime) => {
 							const state = connection.getActiveState(runtime);
 							states.add(state);
 							stateInfo += activeStateToString(state) + runtime;
@@ -1702,7 +1705,7 @@ Caller might not support runtime-dependent code generation (opt-out via optimiza
 			/**
 			 * @param {Module} module module
 			 */
-			const addModuleToHash = module => {
+			const addModuleToHash = (module) => {
 				hash.update(
 					this._getModuleGraphHashBigInt(
 						this._getChunkGraphModule(module),
@@ -1714,7 +1717,7 @@ Caller might not support runtime-dependent code generation (opt-out via optimiza
 			/**
 			 * @param {Set<Module>} modules modules
 			 */
-			const addModulesToHash = modules => {
+			const addModulesToHash = (modules) => {
 				let xor = ZERO_BIG_INT;
 				for (const m of modules) {
 					xor ^= this._getModuleGraphHashBigInt(
@@ -1769,7 +1772,7 @@ Caller might not support runtime-dependent code generation (opt-out via optimiza
 			 * @param {Module} module the module
 			 * @returns {ChunkGraph} the chunk graph
 			 */
-			module => {
+			(module) => {
 				const chunkGraph = chunkGraphForModuleMap.get(module);
 				if (!chunkGraph) {
 					throw new Error(
@@ -1821,7 +1824,7 @@ Caller might not support runtime-dependent code generation (opt-out via optimiza
 			 * @param {Chunk} chunk the chunk
 			 * @returns {ChunkGraph} the chunk graph
 			 */
-			chunk => {
+			(chunk) => {
 				const chunkGraph = chunkGraphForChunkMap.get(chunk);
 				if (!chunkGraph) {
 					throw new Error(

package/lib/ChunkGroup.js

@@ -40,7 +40,7 @@ let debugId = 5000;
  * @param {SortableSet<T>} set set to convert to array.
  * @returns {T[]} the array format of existing set
  */
-const getArray = set => [...set];
+const getArray = (set) => [...set];
 
 /**
  * A convenience method used to sort chunks based on their id's
@@ -165,7 +165,7 @@ class ChunkGroup {
 	 * @returns {string} a unique concatenation of chunk debugId's
 	 */
 	get debugId() {
-		return Array.from(this.chunks, x => x.debugId).join("+");
+		return Array.from(this.chunks, (x) => x.debugId).join("+");
 	}
 
 	/**
@@ -173,7 +173,7 @@ class ChunkGroup {
 	 * @returns {string} a unique concatenation of chunk ids
 	 */
 	get id() {
-		return Array.from(this.chunks, x => x.id).join("+");
+		return Array.from(this.chunks, (x) => x.id).join("+");
 	}
 
 	/**
@@ -533,7 +533,7 @@ class ChunkGroup {
 				if (cmp !== 0) return cmp;
 				return a.group.compareTo(chunkGraph, b.group);
 			});
-			result[name] = list.map(i => i.group);
+			result[name] = list.map((i) => i.group);
 		}
 		return result;
 	}