webpack 5.59.0 → 5.71.0

package/README.md

@@ -9,8 +9,6 @@
 
 [![node][node]][node-url]
 [![deps][deps]][deps-url]
-[![tests][tests]][tests-url]
-[![builds][builds]][builds-url]
 [![builds2][builds2]][builds2-url]
 [![coverage][cover]][cover-url]
 [![licenses][licenses]][licenses-url]
@@ -689,7 +687,7 @@ src="https://static.monei.net/monei-logo.svg" height="30" alt="MONEI"></a>
 
 - [@google](https://github.com/google) for [Google Web Toolkit (GWT)](http://www.gwtproject.org/), which aims to compile Java to JavaScript. It features a similar [Code Splitting](http://www.gwtproject.org/doc/latest/DevGuideCodeSplitting.html) as webpack.
 - [@medikoo](https://github.com/medikoo) for [modules-webmake](https://github.com/medikoo/modules-webmake), which is a similar project. webpack was born because I wanted Code Splitting for modules-webmake. Interestingly the [Code Splitting issue is still open](https://github.com/medikoo/modules-webmake/issues/7) (thanks also to @Phoscur for the discussion).
-- [@substack](https://github.com/substack) for [browserify](http://browserify.org/), which is a similar project and source for many ideas.
+- [@substack](https://github.com/substack) for [browserify](https://browserify.org/), which is a similar project and source for many ideas.
 - [@jrburke](https://github.com/jrburke) for [require.js](https://requirejs.org/), which is a similar project and source for many ideas.
 - [@defunctzombie](https://github.com/defunctzombie) for the [browser-field spec](https://github.com/defunctzombie/package-browser-field-spec), which makes modules available for node.js, browserify and webpack.
 - Every early webpack user, which contributed to webpack by writing issues or PRs. You influenced the direction...
@@ -703,12 +701,8 @@ src="https://static.monei.net/monei-logo.svg" height="30" alt="MONEI"></a>
 [node-url]: https://nodejs.org
 [deps]: https://img.shields.io/david/webpack/webpack.svg
 [deps-url]: https://david-dm.org/webpack/webpack
-[tests]: https://img.shields.io/travis/webpack/webpack/main.svg
-[tests-url]: https://travis-ci.org/webpack/webpack
 [prs]: https://img.shields.io/badge/PRs-welcome-brightgreen.svg
 [prs-url]: https://webpack.js.org/contribute/
-[builds-url]: https://ci.appveyor.com/project/sokra/webpack/branch/main
-[builds]: https://ci.appveyor.com/api/projects/status/github/webpack/webpack?svg=true
 [builds2]: https://dev.azure.com/webpack/webpack/_apis/build/status/webpack.webpack
 [builds2-url]: https://dev.azure.com/webpack/webpack/_build/latest?definitionId=3
 [licenses-url]: https://app.fossa.io/projects/git%2Bhttps%3A%2F%2Fgithub.com%2Fwebpack%2Fwebpack?ref=badge_shield

package/hot/lazy-compilation-node.js

@@ -9,7 +9,9 @@ exports.keepAlive = function (options) {
 	var active = options.active;
 	var module = options.module;
 	var response;
-	var request = require("http").request(
+	var request = (
+		urlBase.startsWith("https") ? require("https") : require("http")
+	).request(
 		urlBase + data,
 		{
 			agent: false,

package/hot/poll.js

@@ -4,7 +4,7 @@
 */
 /*globals __resourceQuery */
 if (module.hot) {
-	var hotPollInterval = +__resourceQuery.substr(1) || 10 * 60 * 1000;
+	var hotPollInterval = +__resourceQuery.slice(1) || 10 * 60 * 1000;
 	var log = require("./log");
 
 	var checkForUpdate = function checkForUpdate(fromUpdate) {

package/hot/signal.js

@@ -45,7 +45,7 @@ if (module.hot) {
 			});
 	};
 
-	process.on(__resourceQuery.substr(1) || "SIGUSR2", function () {
+	process.on(__resourceQuery.slice(1) || "SIGUSR2", function () {
 		if (module.hot.status() !== "idle") {
 			log(
 				"warning",

package/lib/APIPlugin.js

@@ -201,6 +201,39 @@ class APIPlugin {
 								)
 								.setRange(expr.range)
 						);
+
+					parser.hooks.expression
+						.for("__webpack_module__.id")
+						.tap("APIPlugin", expr => {
+							parser.state.module.buildInfo.moduleConcatenationBailout =
+								"__webpack_module__.id";
+							const dep = new ConstDependency(
+								parser.state.module.moduleArgument + ".id",
+								expr.range,
+								[RuntimeGlobals.moduleId]
+							);
+							dep.loc = expr.loc;
+							parser.state.module.addPresentationalDependency(dep);
+							return true;
+						});
+
+					parser.hooks.expression
+						.for("__webpack_module__")
+						.tap("APIPlugin", expr => {
+							parser.state.module.buildInfo.moduleConcatenationBailout =
+								"__webpack_module__";
+							const dep = new ConstDependency(
+								parser.state.module.moduleArgument,
+								expr.range,
+								[RuntimeGlobals.module]
+							);
+							dep.loc = expr.loc;
+							parser.state.module.addPresentationalDependency(dep);
+							return true;
+						});
+					parser.hooks.evaluateTypeof
+						.for("__webpack_module__")
+						.tap("APIPlugin", evaluateToString("object"));
 				};
 
 				normalModuleFactory.hooks.parser

package/lib/BannerPlugin.js

@@ -77,6 +77,7 @@ class BannerPlugin {
 			undefined,
 			options
 		);
+		const cache = new WeakMap();
 
 		compiler.hooks.compilation.tap("BannerPlugin", compilation => {
 			compilation.hooks.processAssets.tap(
@@ -102,10 +103,15 @@ class BannerPlugin {
 
 							const comment = compilation.getPath(banner, data);
 
-							compilation.updateAsset(
-								file,
-								old => new ConcatSource(comment, "\n", old)
-							);
+							compilation.updateAsset(file, old => {
+								let cached = cache.get(old);
+								if (!cached || cached.comment !== comment) {
+									const source = new ConcatSource(comment, "\n", old);
+									cache.set(old, { source, comment });
+									return source;
+								}
+								return cached.source;
+							});
 						}
 					}
 				}

package/lib/Cache.js

@@ -21,7 +21,7 @@ const {
 /**
  * @template T
  * @callback CallbackCache
- * @param {WebpackError=} err
+ * @param {(WebpackError | null)=} err
  * @param {T=} result
  * @returns {void}
  */

package/lib/CacheFacade.js

@@ -5,6 +5,7 @@
 
 "use strict";
 
+const { forEachBail } = require("enhanced-resolve");
 const asyncLib = require("neo-async");
 const getLazyHashedEtag = require("./cache/getLazyHashedEtag");
 const mergeEtags = require("./cache/mergeEtags");
@@ -18,7 +19,7 @@ const mergeEtags = require("./cache/mergeEtags");
 /**
  * @template T
  * @callback CallbackCache
- * @param {WebpackError=} err
+ * @param {(WebpackError | null)=} err
  * @param {T=} result
  * @returns {void}
  */
@@ -26,7 +27,7 @@ const mergeEtags = require("./cache/mergeEtags");
 /**
  * @template T
  * @callback CallbackNormalErrorCache
- * @param {Error=} err
+ * @param {(Error | null)=} err
  * @param {T=} result
  * @returns {void}
  */
@@ -46,15 +47,7 @@ class MultiItemCache {
 	 * @returns {void}
 	 */
 	get(callback) {
-		const next = i => {
-			this._items[i].get((err, result) => {
-				if (err) return callback(err);
-				if (result !== undefined) return callback(null, result);
-				if (++i >= this._items.length) return callback();
-				next(i);
-			});
-		};
-		next(0);
+		forEachBail(this._items, (item, callback) => item.get(callback), callback);
 	}
 
 	/**

package/lib/Chunk.js

@@ -63,8 +63,9 @@ let debugId = 1000;
 class Chunk {
 	/**
 	 * @param {string=} name of chunk being created, is optional (for subclasses)
+	 * @param {boolean} backCompat enable backward-compatibility
 	 */
-	constructor(name) {
+	constructor(name, backCompat = true) {
 		/** @type {number | string | null} */
 		this.id = null;
 		/** @type {(number|string)[] | null} */
@@ -79,12 +80,14 @@ class Chunk {
 		this.preventIntegration = false;
 		/** @type {(string | function(PathData, AssetInfo=): string)?} */
 		this.filenameTemplate = undefined;
+		/** @type {(string | function(PathData, AssetInfo=): string)?} */
+		this.cssFilenameTemplate = undefined;
 		/** @private @type {SortableSet<ChunkGroup>} */
 		this._groups = new SortableSet(undefined, compareChunkGroupsByIndex);
 		/** @type {RuntimeSpec} */
 		this.runtime = undefined;
 		/** @type {Set<string>} */
-		this.files = new ChunkFilesSet();
+		this.files = backCompat ? new ChunkFilesSet() : new Set();
 		/** @type {Set<string>} */
 		this.auxiliaryFiles = new Set();
 		/** @type {boolean} */
@@ -687,7 +690,7 @@ class Chunk {
 				for (const childGroup of group.childrenIterable) {
 					for (const key of Object.keys(childGroup.options)) {
 						if (key.endsWith("Order")) {
-							const name = key.substr(0, key.length - "Order".length);
+							const name = key.slice(0, key.length - "Order".length);
 							let list = lists.get(name);
 							if (list === undefined) {
 								list = [];

package/lib/ChunkGraph.js

@@ -46,6 +46,7 @@ const compareModuleIterables = compareIterables(compareModulesByIdentifier);
 
 /** @typedef {(c: Chunk, chunkGraph: ChunkGraph) => boolean} ChunkFilterPredicate */
 /** @typedef {(m: Module) => boolean} ModuleFilterPredicate */
+/** @typedef {[Module, Entrypoint | undefined]} EntryModuleWithChunkGroup */
 
 /**
  * @typedef {Object} ChunkSizeOptions
@@ -1180,8 +1181,6 @@ class ChunkGraph {
 		return cgc.dependentHashModules;
 	}
 
-	/** @typedef {[Module, Entrypoint | undefined]} EntryModuleWithChunkGroup */
-
 	/**
 	 * @param {Chunk} chunk the chunk
 	 * @returns {Iterable<EntryModuleWithChunkGroup>} iterable of modules (do not modify)

package/lib/ChunkGroup.js

@@ -486,7 +486,7 @@ class ChunkGroup {
 		for (const childGroup of this._children) {
 			for (const key of Object.keys(childGroup.options)) {
 				if (key.endsWith("Order")) {
-					const name = key.substr(0, key.length - "Order".length);
+					const name = key.slice(0, key.length - "Order".length);
 					let list = lists.get(name);
 					if (list === undefined) {
 						lists.set(name, (list = []));

package/lib/CleanPlugin.js

@@ -16,8 +16,10 @@ const processAsyncTree = require("./util/processAsyncTree");
 /** @typedef {import("./Compiler")} Compiler */
 /** @typedef {import("./logging/Logger").Logger} Logger */
 /** @typedef {import("./util/fs").OutputFileSystem} OutputFileSystem */
+/** @typedef {import("./util/fs").StatsCallback} StatsCallback */
 
 /** @typedef {(function(string):boolean)|RegExp} IgnoreItem */
+/** @typedef {Map<string, number>} Assets */
 /** @typedef {function(IgnoreItem): void} AddToIgnoreCallback */
 
 /**
@@ -39,18 +41,32 @@ const validate = createSchemaValidation(
 		baseDataPath: "options"
 	}
 );
+const _10sec = 10 * 1000;
+
+/**
+ * marge assets map 2 into map 1
+ * @param {Assets} as1 assets
+ * @param {Assets} as2 assets
+ * @returns {void}
+ */
+const mergeAssets = (as1, as2) => {
+	for (const [key, value1] of as2) {
+		const value2 = as1.get(key);
+		if (!value2 || value1 > value2) as1.set(key, value1);
+	}
+};
 
 /**
  * @param {OutputFileSystem} fs filesystem
  * @param {string} outputPath output path
- * @param {Set<string>} currentAssets filename of the current assets (must not start with .. or ., must only use / as path separator)
- * @param {function(Error=, Set<string>=): void} callback returns the filenames of the assets that shouldn't be there
+ * @param {Map<string, number>} currentAssets filename of the current assets (must not start with .. or ., must only use / as path separator)
+ * @param {function((Error | null)=, Set<string>=): void} callback returns the filenames of the assets that shouldn't be there
  * @returns {void}
  */
 const getDiffToFs = (fs, outputPath, currentAssets, callback) => {
 	const directories = new Set();
 	// get directories of assets
-	for (const asset of currentAssets) {
+	for (const [asset] of currentAssets) {
 		directories.add(asset.replace(/(^|\/)[^/]*$/, ""));
 	}
 	// and all parent directories
@@ -90,18 +106,34 @@ const getDiffToFs = (fs, outputPath, currentAssets, callback) => {
 };
 
 /**
- * @param {Set<string>} currentAssets assets list
- * @param {Set<string>} oldAssets old assets list
+ * @param {Assets} currentAssets assets list
+ * @param {Assets} oldAssets old assets list
  * @returns {Set<string>} diff
  */
 const getDiffToOldAssets = (currentAssets, oldAssets) => {
 	const diff = new Set();
-	for (const asset of oldAssets) {
+	const now = Date.now();
+	for (const [asset, ts] of oldAssets) {
+		if (ts >= now) continue;
 		if (!currentAssets.has(asset)) diff.add(asset);
 	}
 	return diff;
 };
 
+/**
+ * @param {OutputFileSystem} fs filesystem
+ * @param {string} filename path to file
+ * @param {StatsCallback} callback callback for provided filename
+ * @returns {void}
+ */
+const doStat = (fs, filename, callback) => {
+	if ("lstat" in fs) {
+		fs.lstat(filename, callback);
+	} else {
+		fs.stat(filename, callback);
+	}
+};
+
 /**
  * @param {OutputFileSystem} fs filesystem
  * @param {string} outputPath output path
@@ -109,7 +141,7 @@ const getDiffToOldAssets = (currentAssets, oldAssets) => {
  * @param {Logger} logger logger
  * @param {Set<string>} diff filenames of the assets that shouldn't be there
  * @param {function(string): boolean} isKept check if the entry is ignored
- * @param {function(Error=): void} callback callback
+ * @param {function(Error=, Assets=): void} callback callback
  * @returns {void}
  */
 const applyDiff = (fs, outputPath, dry, logger, diff, isKept, callback) => {
@@ -122,11 +154,13 @@ const applyDiff = (fs, outputPath, dry, logger, diff, isKept, callback) => {
 	};
 	/** @typedef {{ type: "check" | "unlink" | "rmdir", filename: string, parent: { remaining: number, job: Job } | undefined }} Job */
 	/** @type {Job[]} */
-	const jobs = Array.from(diff, filename => ({
+	const jobs = Array.from(diff.keys(), filename => ({
 		type: "check",
 		filename,
 		parent: undefined
 	}));
+	/** @type {Assets} */
+	const keptAssets = new Map();
 	processAsyncTree(
 		jobs,
 		10,
@@ -146,11 +180,12 @@ const applyDiff = (fs, outputPath, dry, logger, diff, isKept, callback) => {
 			switch (type) {
 				case "check":
 					if (isKept(filename)) {
+						keptAssets.set(filename, 0);
 						// do not decrement parent entry as we don't want to delete the parent
 						log(`${filename} will be kept`);
 						return process.nextTick(callback);
 					}
-					fs.stat(path, (err, stats) => {
+					doStat(fs, path, (err, stats) => {
 						if (err) return handleError(err);
 						if (!stats.isDirectory()) {
 							push({
@@ -232,7 +267,10 @@ const applyDiff = (fs, outputPath, dry, logger, diff, isKept, callback) => {
 					break;
 			}
 		},
-		callback
+		err => {
+			if (err) return callback(err);
+			callback(undefined, keptAssets);
+		}
 	);
 };
 
@@ -287,6 +325,7 @@ class CleanPlugin {
 		// We assume that no external modification happens while the compiler is active
 		// So we can store the old assets and only diff to them to avoid fs access on
 		// incremental builds
+		/** @type {undefined|Assets} */
 		let oldAssets;
 
 		compiler.hooks.emit.tapAsync(
@@ -307,7 +346,9 @@ class CleanPlugin {
 					);
 				}
 
-				const currentAssets = new Set();
+				/** @type {Assets} */
+				const currentAssets = new Map();
+				const now = Date.now();
 				for (const asset of Object.keys(compilation.assets)) {
 					if (/^[A-Za-z]:\\|^\/|^\\\\/.test(asset)) continue;
 					let normalizedAsset;
@@ -320,7 +361,12 @@ class CleanPlugin {
 						);
 					} while (newNormalizedAsset !== normalizedAsset);
 					if (normalizedAsset.startsWith("../")) continue;
-					currentAssets.add(normalizedAsset);
+					const assetInfo = compilation.assetsInfo.get(asset);
+					if (assetInfo && assetInfo.hotModuleReplacement) {
+						currentAssets.set(normalizedAsset, now + _10sec);
+					} else {
+						currentAssets.set(normalizedAsset, 0);
+					}
 				}
 
 				const outputPath = compilation.getPath(compiler.outputPath, {});
@@ -331,19 +377,34 @@ class CleanPlugin {
 					return keepFn(path);
 				};
 
+				/**
+				 * @param {Error=} err err
+				 * @param {Set<string>=} diff diff
+				 */
 				const diffCallback = (err, diff) => {
 					if (err) {
 						oldAssets = undefined;
-						return callback(err);
+						callback(err);
+						return;
 					}
-					applyDiff(fs, outputPath, dry, logger, diff, isKept, err => {
-						if (err) {
-							oldAssets = undefined;
-						} else {
-							oldAssets = currentAssets;
+					applyDiff(
+						fs,
+						outputPath,
+						dry,
+						logger,
+						diff,
+						isKept,
+						(err, keptAssets) => {
+							if (err) {
+								oldAssets = undefined;
+							} else {
+								if (oldAssets) mergeAssets(currentAssets, oldAssets);
+								oldAssets = currentAssets;
+								if (keptAssets) mergeAssets(oldAssets, keptAssets);
+							}
+							callback(err);
 						}
-						callback(err);
-					});
+					);
 				};
 
 				if (oldAssets) {