webpack 5.72.0 → 5.74.0

package/README.md

@@ -15,8 +15,8 @@
 [![PR's welcome][prs]][prs-url]
 
   <br>
-  <a href="https://dependabot.com/compatibility-score.html?dependency-name=webpack&package-manager=npm_and_yarn&new-version=latest">
-    <img src="https://api.dependabot.com/badges/compatibility_score?dependency-name=webpack&package-manager=npm_and_yarn&version-scheme=semver&target-version=latest">
+  <a href="https://docs.github.com/en/code-security/dependabot/dependabot-security-updates/about-dependabot-security-updates#about-compatibility-scores">
+    <img src="https://api.dependabot.com/badges/compatibility_score?dependency-name=webpack&package-manager=npm_and_yarn&previous-version=5.72.1&new-version=5.73.0">
   </a>
 	<a href="https://npmcharts.com/compare/webpack?minimal=true">
 		<img src="https://img.shields.io/npm/dm/webpack.svg">
@@ -110,6 +110,7 @@ within webpack itself use this plugin interface. This makes webpack very
 |    [mini-css-extract-plugin][mini-css]    |  ![mini-css-npm]   |  ![mini-css-size]   | Extracts CSS into separate files. It creates a CSS file per JS file which contains CSS. |
 | [compression-webpack-plugin][compression] | ![compression-npm] | ![compression-size] | Prepares compressed versions of assets to serve them with Content-Encoding              |
 |    [html-webpack-plugin][html-plugin]     | ![html-plugin-npm] | ![html-plugin-size] | Simplifies creation of HTML files (`index.html`) to serve your bundles                  |
+|         [pug-plugin][pug-plugin]          | ![pug-plugin-npm]  | ![pug-plugin-size]  | Renders Pug files to HTML, extracts JS and CSS from sources specified directly in Pug.  |
 
 [common-npm]: https://img.shields.io/npm/v/webpack.svg
 [mini-css]: https://github.com/webpack-contrib/mini-css-extract-plugin
@@ -124,6 +125,9 @@ within webpack itself use this plugin interface. This makes webpack very
 [html-plugin]: https://github.com/jantimon/html-webpack-plugin
 [html-plugin-npm]: https://img.shields.io/npm/v/html-webpack-plugin.svg
 [html-plugin-size]: https://packagephobia.com/badge?p=html-webpack-plugin
+[pug-plugin]: https://github.com/webdiscus/pug-plugin
+[pug-plugin-npm]: https://img.shields.io/npm/v/pug-plugin.svg
+[pug-plugin-size]: https://packagephobia.com/badge?p=pug-plugin
 
 ### [Loaders](https://webpack.js.org/loaders/)
 
@@ -170,18 +174,21 @@ or are automatically applied via regex from your webpack configuration.
 
 #### Templating
 
-|                                                                                 Name                                                                                  |     Status      |   Install Size   | Description                                                                             |
-| :-------------------------------------------------------------------------------------------------------------------------------------------------------------------: | :-------------: | :--------------: | :-------------------------------------------------------------------------------------- |
-|              <a href="https://github.com/webpack-contrib/html-loader"><img width="48" height="48" src="https://worldvectorlogo.com/logos/html5.svg"></a>              |   ![html-npm]   |   ![html-size]   | Exports HTML as string, requires references to static resources                         |
-| <a href="https://github.com/pugjs/pug-loader"><img width="48" height="48" src="https://cdn.rawgit.com/pugjs/pug-logo/master/SVG/pug-final-logo-_-colour-128.svg"></a> |   ![pug-npm]    |   ![pug-size]    | Loads Pug templates and returns a function                                              |
-|              <a href="https://github.com/peerigon/markdown-loader"><img width="48" height="48" src="https://worldvectorlogo.com/logos/markdown.svg"></a>              |    ![md-npm]    |    ![md-size]    | Compiles Markdown to HTML                                                               |
-|               <a href="https://github.com/posthtml/posthtml-loader"><img width="48" height="48" src="https://posthtml.github.io/posthtml/logo.svg"></a>               | ![posthtml-npm] | ![posthtml-size] | Loads and transforms a HTML file using [PostHTML](https://github.com/posthtml/posthtml) |
-|           <a href="https://github.com/pcardune/handlebars-loader"><img width="48" height="48" src="https://worldvectorlogo.com/logos/handlebars-1.svg"></a>           |   ![hbs-npm]    |   ![hbs-size]    | Compiles Handlebars to HTML                                                             |
+|                                                                                   Name                                                                                    |     Status      |   Install Size   | Description                                                                             |
+| :-----------------------------------------------------------------------------------------------------------------------------------------------------------------------: | :-------------: | :--------------: | :-------------------------------------------------------------------------------------- |
+|                <a href="https://github.com/webpack-contrib/html-loader"><img width="48" height="48" src="https://worldvectorlogo.com/logos/html5.svg"></a>                |   ![html-npm]   |   ![html-size]   | Exports HTML as string, requires references to static resources                         |
+|   <a href="https://github.com/pugjs/pug-loader"><img width="48" height="48" src="https://cdn.rawgit.com/pugjs/pug-logo/master/SVG/pug-final-logo-_-colour-128.svg"></a>   |   ![pug-npm]    |   ![pug-size]    | Loads Pug templates and returns a function                                              |
+| <a href="https://github.com/webdiscus/pug-loader"><img width="48" height="48" src="https://cdn.rawgit.com/pugjs/pug-logo/master/SVG/pug-final-logo-_-colour-128.svg"></a> |   ![pug3-npm]   |   ![pug3-size]   | Compiles Pug to a function or HTML string, useful for use with Vue, React, Angular      |
+|                <a href="https://github.com/peerigon/markdown-loader"><img width="48" height="48" src="https://worldvectorlogo.com/logos/markdown.svg"></a>                |    ![md-npm]    |    ![md-size]    | Compiles Markdown to HTML                                                               |
+|                 <a href="https://github.com/posthtml/posthtml-loader"><img width="48" height="48" src="https://posthtml.github.io/posthtml/logo.svg"></a>                 | ![posthtml-npm] | ![posthtml-size] | Loads and transforms a HTML file using [PostHTML](https://github.com/posthtml/posthtml) |
+|             <a href="https://github.com/pcardune/handlebars-loader"><img width="48" height="48" src="https://worldvectorlogo.com/logos/handlebars-1.svg"></a>             |   ![hbs-npm]    |   ![hbs-size]    | Compiles Handlebars to HTML                                                             |
 
 [html-npm]: https://img.shields.io/npm/v/html-loader.svg
 [html-size]: https://packagephobia.com/badge?p=html-loader
 [pug-npm]: https://img.shields.io/npm/v/pug-loader.svg
 [pug-size]: https://packagephobia.com/badge?p=pug-loader
+[pug3-npm]: https://img.shields.io/npm/v/@webdiscus/pug-loader.svg
+[pug3-size]: https://packagephobia.com/badge?p=@webdiscus/pug-loader
 [jade-npm]: https://img.shields.io/npm/v/jade-loader.svg
 [jade-size]: https://packagephobia.com/badge?p=jade-loader
 [md-npm]: https://img.shields.io/npm/v/markdown-loader.svg

package/lib/Compilation.js

@@ -4241,7 +4241,11 @@ This prevents using hashes of each other and should be avoided.`);
 			if (!isSourceEqual(this.assets[file], source)) {
 				this.errors.push(
 					new WebpackError(
-						`Conflict: Multiple assets emit different content to the same filename ${file}`
+						`Conflict: Multiple assets emit different content to the same filename ${file}${
+							assetInfo.sourceFilename
+								? `. Original source ${assetInfo.sourceFilename}`
+								: ""
+						}`
 					)
 				);
 				this.assets[file] = source;

package/lib/Compiler.js

@@ -5,7 +5,7 @@
 
 "use strict";
 
-const parseJson = require("json-parse-better-errors");
+const parseJson = require("json-parse-even-better-errors");
 const asyncLib = require("neo-async");
 const {
 	SyncHook,

package/lib/DllReferencePlugin.js

@@ -5,7 +5,7 @@
 
 "use strict";
 
-const parseJson = require("json-parse-better-errors");
+const parseJson = require("json-parse-even-better-errors");
 const DelegatedModuleFactoryPlugin = require("./DelegatedModuleFactoryPlugin");
 const ExternalModuleFactoryPlugin = require("./ExternalModuleFactoryPlugin");
 const WebpackError = require("./WebpackError");

package/lib/FileSystemInfo.js

@@ -8,6 +8,7 @@
 const { create: createResolver } = require("enhanced-resolve");
 const nodeModule = require("module");
 const asyncLib = require("neo-async");
+const { isAbsolute } = require("path");
 const AsyncQueue = require("./util/AsyncQueue");
 const StackedCacheMap = require("./util/StackedCacheMap");
 const createHash = require("./util/createHash");
@@ -207,6 +208,12 @@ class SnapshotIterable {
 class Snapshot {
 	constructor() {
 		this._flags = 0;
+		/** @type {Iterable<string> | undefined} */
+		this._cachedFileIterable = undefined;
+		/** @type {Iterable<string> | undefined} */
+		this._cachedContextIterable = undefined;
+		/** @type {Iterable<string> | undefined} */
+		this._cachedMissingIterable = undefined;
 		/** @type {number | undefined} */
 		this.startTime = undefined;
 		/** @type {Map<string, FileSystemInfoEntry | null> | undefined} */
@@ -417,31 +424,43 @@ class Snapshot {
 	 * @returns {Iterable<string>} iterable
 	 */
 	getFileIterable() {
-		return this._createIterable(s => [
-			s.fileTimestamps,
-			s.fileHashes,
-			s.fileTshs,
-			s.managedFiles
-		]);
+		if (this._cachedFileIterable === undefined) {
+			this._cachedFileIterable = this._createIterable(s => [
+				s.fileTimestamps,
+				s.fileHashes,
+				s.fileTshs,
+				s.managedFiles
+			]);
+		}
+		return this._cachedFileIterable;
 	}
 
 	/**
 	 * @returns {Iterable<string>} iterable
 	 */
 	getContextIterable() {
-		return this._createIterable(s => [
-			s.contextTimestamps,
-			s.contextHashes,
-			s.contextTshs,
-			s.managedContexts
-		]);
+		if (this._cachedContextIterable === undefined) {
+			this._cachedContextIterable = this._createIterable(s => [
+				s.contextTimestamps,
+				s.contextHashes,
+				s.contextTshs,
+				s.managedContexts
+			]);
+		}
+		return this._cachedContextIterable;
 	}
 
 	/**
 	 * @returns {Iterable<string>} iterable
 	 */
 	getMissingIterable() {
-		return this._createIterable(s => [s.missingExistence, s.managedMissing]);
+		if (this._cachedMissingIterable === undefined) {
+			this._cachedMissingIterable = this._createIterable(s => [
+				s.missingExistence,
+				s.managedMissing
+			]);
+		}
+		return this._cachedMissingIterable;
 	}
 }
 
@@ -1633,7 +1652,9 @@ class FileSystemInfo {
 									let request = relative(this.fs, context, childPath);
 									if (request.endsWith(".js")) request = request.slice(0, -3);
 									request = request.replace(/\\/g, "/");
-									if (!request.startsWith("../")) request = `./${request}`;
+									if (!request.startsWith("../") && !isAbsolute(request)) {
+										request = `./${request}`;
+									}
 									push({
 										type: RBDT_RESOLVE_CJS_FILE,
 										context,

package/lib/NodeStuffPlugin.js

@@ -64,7 +64,7 @@ class NodeStuffPlugin {
 										new NodeStuffInWebError(
 											dep.loc,
 											"global",
-											"The global namespace object is Node.js feature and doesn't present in browser."
+											"The global namespace object is a Node.js feature and isn't available in browsers."
 										)
 									);
 								}
@@ -117,7 +117,7 @@ class NodeStuffPlugin {
 								setConstant(
 									"__filename",
 									"/index.js",
-									"The __filename is Node.js feature and doesn't present in browser."
+									"__filename is a Node.js feature and isn't available in browsers."
 								);
 								break;
 							case true:
@@ -144,7 +144,7 @@ class NodeStuffPlugin {
 								setConstant(
 									"__dirname",
 									"/",
-									"The __dirname is Node.js feature and doesn't present in browser."
+									"__dirname is a Node.js feature and isn't available in browsers."
 								);
 								break;
 							case true:

package/lib/NormalModule.js

@@ -5,7 +5,7 @@
 
 "use strict";
 
-const parseJson = require("json-parse-better-errors");
+const parseJson = require("json-parse-even-better-errors");
 const { getContext, runLoaders } = require("loader-runner");
 const querystring = require("querystring");
 const { HookMap, SyncHook, AsyncSeriesBailHook } = require("tapable");

package/lib/RuntimePlugin.js

@@ -26,6 +26,7 @@ const GlobalRuntimeModule = require("./runtime/GlobalRuntimeModule");
 const HasOwnPropertyRuntimeModule = require("./runtime/HasOwnPropertyRuntimeModule");
 const LoadScriptRuntimeModule = require("./runtime/LoadScriptRuntimeModule");
 const MakeNamespaceObjectRuntimeModule = require("./runtime/MakeNamespaceObjectRuntimeModule");
+const NonceRuntimeModule = require("./runtime/NonceRuntimeModule");
 const OnChunksLoadedRuntimeModule = require("./runtime/OnChunksLoadedRuntimeModule");
 const PublicPathRuntimeModule = require("./runtime/PublicPathRuntimeModule");
 const RelativeUrlRuntimeModule = require("./runtime/RelativeUrlRuntimeModule");
@@ -431,6 +432,12 @@ class RuntimePlugin {
 						return true;
 					}
 				});
+			compilation.hooks.runtimeRequirementInTree
+				.for(RuntimeGlobals.scriptNonce)
+				.tap("RuntimePlugin", chunk => {
+					compilation.addRuntimeModule(chunk, new NonceRuntimeModule());
+					return true;
+				});
 			// TODO webpack 6: remove CompatRuntimeModule
 			compilation.hooks.additionalTreeRuntimeRequirements.tap(
 				"RuntimePlugin",

package/lib/config/defaults.js

@@ -190,7 +190,8 @@ const applyWebpackOptionsDefaults = options => {
 		syncWebAssembly: options.experiments.syncWebAssembly,
 		asyncWebAssembly: options.experiments.asyncWebAssembly,
 		css: options.experiments.css,
-		futureDefaults
+		futureDefaults,
+		isNode: targetProperties && targetProperties.node === true
 	});
 
 	applyOutputDefaults(options.output, {
@@ -451,11 +452,12 @@ const applySnapshotDefaults = (snapshot, { production, futureDefaults }) => {
  * @param {JavascriptParserOptions} parserOptions parser options
  * @param {Object} options options
  * @param {boolean} options.futureDefaults is future defaults enabled
+ * @param {boolean} options.isNode is node target platform
  * @returns {void}
  */
 const applyJavascriptParserOptionsDefaults = (
 	parserOptions,
-	{ futureDefaults }
+	{ futureDefaults, isNode }
 ) => {
 	D(parserOptions, "unknownContextRequest", ".");
 	D(parserOptions, "unknownContextRegExp", false);
@@ -470,6 +472,10 @@ const applyJavascriptParserOptionsDefaults = (
 	D(parserOptions, "wrappedContextCritical", false);
 	D(parserOptions, "strictThisContextOnImports", false);
 	D(parserOptions, "importMeta", true);
+	D(parserOptions, "dynamicImportMode", "lazy");
+	D(parserOptions, "dynamicImportPrefetch", false);
+	D(parserOptions, "dynamicImportPreload", false);
+	D(parserOptions, "createRequire", isNode);
 	if (futureDefaults) D(parserOptions, "exportsPresence", "error");
 };
 
@@ -481,11 +487,12 @@ const applyJavascriptParserOptionsDefaults = (
  * @param {boolean} options.asyncWebAssembly is asyncWebAssembly enabled
  * @param {CssExperimentOptions} options.css is css enabled
  * @param {boolean} options.futureDefaults is future defaults enabled
+ * @param {boolean} options.isNode is node target platform
  * @returns {void}
  */
 const applyModuleDefaults = (
 	module,
-	{ cache, syncWebAssembly, asyncWebAssembly, css, futureDefaults }
+	{ cache, syncWebAssembly, asyncWebAssembly, css, futureDefaults, isNode }
 ) => {
 	if (cache) {
 		D(module, "unsafeCache", module => {
@@ -504,7 +511,8 @@ const applyModuleDefaults = (
 
 	F(module.parser, "javascript", () => ({}));
 	applyJavascriptParserOptionsDefaults(module.parser.javascript, {
-		futureDefaults
+		futureDefaults,
+		isNode
 	});
 
 	A(module, "defaultRules", () => {

package/lib/container/ModuleFederationPlugin.js

@@ -65,6 +65,7 @@ class ModuleFederationPlugin {
 					library,
 					filename: options.filename,
 					runtime: options.runtime,
+					shareScope: options.shareScope,
 					exposes: options.exposes
 				}).apply(compiler);
 			}
@@ -76,6 +77,7 @@ class ModuleFederationPlugin {
 			) {
 				new ContainerReferencePlugin({
 					remoteType,
+					shareScope: options.shareScope,
 					remotes: options.remotes
 				}).apply(compiler);
 			}

package/lib/css/CssLoadingRuntimeModule.js

@@ -108,13 +108,15 @@ class CssLoadingRuntimeModule extends RuntimeModule {
 			'link.rel = "stylesheet";',
 			"link.href = url;",
 			crossOriginLoading
-				? Template.asString([
-						"if (link.src.indexOf(window.location.origin + '/') !== 0) {",
-						Template.indent(
-							`link.crossOrigin = ${JSON.stringify(crossOriginLoading)};`
-						),
-						"}"
-				  ])
+				? crossOriginLoading === "use-credentials"
+					? 'link.crossOrigin = "use-credentials";'
+					: Template.asString([
+							"if (link.src.indexOf(window.location.origin + '/') !== 0) {",
+							Template.indent(
+								`link.crossOrigin = ${JSON.stringify(crossOriginLoading)};`
+							),
+							"}"
+					  ])
 				: ""
 		]);