webpack 5.106.1 → 5.107.0

package/lib/config/defaults.js

@@ -22,6 +22,7 @@ const {
 	CSS_MODULE_TYPE_AUTO,
 	CSS_MODULE_TYPE_GLOBAL,
 	CSS_MODULE_TYPE_MODULE,
+	HTML_MODULE_TYPE,
 	JAVASCRIPT_MODULE_TYPE_AUTO,
 	JAVASCRIPT_MODULE_TYPE_DYNAMIC,
 	JAVASCRIPT_MODULE_TYPE_ESM,
@@ -80,11 +81,13 @@ const {
 /** @typedef {import("./target").TargetProperties} TargetProperties */
 
 /**
+ * Defines the recursive non nullable type used by this module.
  * @template T
  * @typedef {{ [P in keyof T]-?: T[P] extends object ? RecursiveNonNullable<NonNullable<T[P]>> : NonNullable<T[P]> }} RecursiveNonNullable
  */
 
 /**
+ * Defines the shared type used by this module.
  * @typedef {Output & {
  * uniqueName: NonNullable<Output["uniqueName"]>,
  * filename: NonNullable<Output["filename"]>,
@@ -129,6 +132,7 @@ const {
  */
 
 /**
+ * Defines the shared type used by this module.
  * @typedef {SnapshotOptions & {
  * managedPaths: NonNullable<SnapshotOptions["managedPaths"]>,
  * unmanagedPaths: NonNullable<SnapshotOptions["unmanagedPaths"]>,
@@ -141,6 +145,7 @@ const {
  */
 
 /**
+ * Defines the shared type used by this module.
  * @typedef {Optimization & {
  * runtimeChunk: NonNullable<Optimization["runtimeChunk"]>,
  * splitChunks: NonNullable<Optimization["splitChunks"]>,
@@ -169,6 +174,7 @@ const {
  */
 
 /**
+ * Defines the shared type used by this module.
  * @typedef {ExternalsPresets & {
  * web: NonNullable<ExternalsPresets["web"]>,
  * node: NonNullable<ExternalsPresets["node"]>,
@@ -181,6 +187,7 @@ const {
  */
 
 /**
+ * Defines the shared type used by this module.
  * @typedef {InfrastructureLogging & {
  * stream: NonNullable<InfrastructureLogging["stream"]>,
  * level: NonNullable<InfrastructureLogging["level"]>,
@@ -191,14 +198,17 @@ const {
  */
 
 /**
+ * Defines the webpack options normalized with base defaults type used by this module.
  * @typedef {WebpackOptionsNormalized & { context: NonNullable<WebpackOptionsNormalized["context"]> } & { infrastructureLogging: InfrastructureLoggingNormalizedWithDefaults }} WebpackOptionsNormalizedWithBaseDefaults
  */
 
 /**
+ * Defines the webpack options normalized with defaults type used by this module.
  * @typedef {WebpackOptionsNormalizedWithBaseDefaults & { target: NonNullable<WebpackOptionsNormalized["target"]> } & { output: OutputNormalizedWithDefaults } & { optimization: OptimizationNormalizedWithDefaults } & { devtool: NonNullable<WebpackOptionsNormalized["devtool"]> } & { stats: NonNullable<WebpackOptionsNormalized["stats"]> } & { node: NonNullable<WebpackOptionsNormalized["node"]> } & { profile: NonNullable<WebpackOptionsNormalized["profile"]> } & { parallelism: NonNullable<WebpackOptionsNormalized["parallelism"]> } & { snapshot: SnapshotNormalizedWithDefaults } & { externalsPresets: ExternalsPresetsNormalizedWithDefaults } & { externalsType: NonNullable<WebpackOptionsNormalized["externalsType"]> } & { watch: NonNullable<WebpackOptionsNormalized["watch"]> } & { performance: NonNullable<WebpackOptionsNormalized["performance"]> } & { recordsInputPath: NonNullable<WebpackOptionsNormalized["recordsInputPath"]> } & { recordsOutputPath: NonNullable<WebpackOptionsNormalized["recordsOutputPath"]> } & { dotenv: NonNullable<WebpackOptionsNormalized["dotenv"]> }} WebpackOptionsNormalizedWithDefaults
  */
 
 /**
+ * Defines the resolved options type used by this module.
  * @typedef {object} ResolvedOptions
  * @property {PlatformTargetProperties | false} platform - platform target properties
  */
@@ -211,7 +221,7 @@ const DEFAULTS = {
 };
 
 /**
- * Sets a constant default value when undefined
+ * Processes the provided obj.
  * @template T
  * @template {keyof T} P
  * @param {T} obj an object
@@ -226,7 +236,7 @@ const D = (obj, prop, value) => {
 };
 
 /**
- * Sets a dynamic default value when undefined, by calling the factory function
+ * Processes the provided obj.
  * @template T
  * @template {keyof T} P
  * @param {T} obj an object
@@ -282,6 +292,7 @@ const A = (obj, prop, factory) => {
 };
 
 /**
+ * Apply webpack options base defaults.
  * @param {WebpackOptionsNormalized} options options to be modified
  * @returns {void}
  */
@@ -291,6 +302,7 @@ const applyWebpackOptionsBaseDefaults = (options) => {
 };
 
 /**
+ * Apply webpack options defaults.
  * @param {WebpackOptionsNormalized} options options to be modified
  * @param {number=} compilerIndex index of compiler
  * @returns {ResolvedOptions} Resolved options after apply defaults
@@ -420,6 +432,12 @@ const applyWebpackOptionsDefaults = (options, compilerIndex) => {
 		css:
 			/** @type {NonNullable<ExperimentsNormalized["css"]>} */
 			(options.experiments.css),
+		html:
+			/** @type {NonNullable<ExperimentsNormalized["html"]>} */
+			(options.experiments.html),
+		typescript:
+			/** @type {NonNullable<ExperimentsNormalized["typescript"]>} */
+			(options.experiments.typescript),
 		deferImport:
 			/** @type {NonNullable<ExperimentsNormalized["deferImport"]>} */
 			(options.experiments.deferImport),
@@ -433,7 +451,8 @@ const applyWebpackOptionsDefaults = (options, compilerIndex) => {
 		mode: options.mode,
 		outputModule:
 			/** @type {NonNullable<WebpackOptionsNormalized["output"]["module"]>} */
-			(options.output.module)
+			(options.output.module),
+		library: options.output.library
 	});
 
 	applyExternalsPresetsDefaults(options.externalsPresets, {
@@ -505,7 +524,10 @@ const applyWebpackOptionsDefaults = (options, compilerIndex) => {
 			mode: /** @type {Mode} */ (options.mode),
 			css:
 				/** @type {NonNullable<ExperimentsNormalized["css"]>} */
-				(options.experiments.css)
+				(options.experiments.css),
+			typescript:
+				/** @type {NonNullable<ExperimentsNormalized["typescript"]>} */
+				(options.experiments.typescript)
 		}),
 		options.resolve
 	);
@@ -531,6 +553,7 @@ const applyWebpackOptionsDefaults = (options, compilerIndex) => {
 };
 
 /**
+ * Apply experiments defaults.
  * @param {ExperimentsNormalized} experiments options
  * @param {object} options options
  * @param {boolean} options.production is production
@@ -554,6 +577,10 @@ const applyExperimentsDefaults = (
 	D(experiments, "deferImport", false);
 	D(experiments, "sourceImport", false);
 	F(experiments, "css", () => (experiments.futureDefaults ? true : undefined));
+	F(experiments, "html", () => (experiments.futureDefaults ? true : undefined));
+	F(experiments, "typescript", () =>
+		experiments.futureDefaults ? true : undefined
+	);
 
 	if (typeof experiments.buildHttp === "object") {
 		D(experiments.buildHttp, "frozen", production);
@@ -562,6 +589,7 @@ const applyExperimentsDefaults = (
 };
 
 /**
+ * Apply cache defaults.
  * @param {CacheOptionsNormalized} cache options
  * @param {object} options options
  * @param {string} options.name name
@@ -644,6 +672,7 @@ const applyCacheDefaults = (
 };
 
 /**
+ * Apply snapshot defaults.
  * @param {SnapshotOptions} snapshot options
  * @param {object} options options
  * @param {boolean} options.production is production
@@ -721,6 +750,7 @@ const applySnapshotDefaults = (snapshot, { production, futureDefaults }) => {
 };
 
 /**
+ * Apply javascript parser options defaults.
  * @param {JavascriptParserOptions} parserOptions parser options
  * @param {object} options options
  * @param {boolean} options.futureDefaults is future defaults enabled
@@ -728,11 +758,21 @@ const applySnapshotDefaults = (snapshot, { production, futureDefaults }) => {
  * @param {boolean} options.sourceImport is import source enabled
  * @param {boolean} options.isNode is node target platform
  * @param {boolean} options.outputModule is output.module enabled
+ * @param {WebpackOptionsNormalized["output"]["library"]} options.library library options
+ * @param {boolean} options.typescript is typescript enabled
  * @returns {void}
  */
 const applyJavascriptParserOptionsDefaults = (
 	parserOptions,
-	{ futureDefaults, deferImport, sourceImport, isNode, outputModule }
+	{
+		futureDefaults,
+		deferImport,
+		sourceImport,
+		isNode,
+		outputModule,
+		library,
+		typescript
+	}
 ) => {
 	D(parserOptions, "unknownContextRequest", ".");
 	D(parserOptions, "unknownContextRegExp", false);
@@ -755,10 +795,13 @@ const applyJavascriptParserOptionsDefaults = (
 	D(parserOptions, "dynamicUrl", true);
 	D(parserOptions, "deferImport", deferImport);
 	D(parserOptions, "sourceImport", sourceImport);
+	D(parserOptions, "typescript", typescript);
 	if (futureDefaults) D(parserOptions, "exportsPresence", "error");
+	D(parserOptions, "anonymousDefaultExportName", !library);
 };
 
 /**
+ * Apply json generator options defaults.
  * @param {JsonGeneratorOptions} generatorOptions generator options
  * @returns {void}
  */
@@ -767,6 +810,7 @@ const applyJsonGeneratorOptionsDefaults = (generatorOptions) => {
 };
 
 /**
+ * Apply css generator options defaults.
  * @param {CssGeneratorOptions} generatorOptions generator options
  * @param {object} options options
  * @param {TargetProperties | false} options.targetProperties target properties
@@ -785,12 +829,15 @@ const applyCssGeneratorOptionsDefaults = (
 };
 
 /**
+ * Apply module defaults.
  * @param {ModuleOptions} module options
  * @param {object} options options
  * @param {boolean} options.cache is caching enabled
  * @param {boolean} options.syncWebAssembly is syncWebAssembly enabled
  * @param {boolean} options.asyncWebAssembly is asyncWebAssembly enabled
+ * @param {boolean} options.typescript is typescript enabled
  * @param {boolean} options.css is css enabled
+ * @param {boolean} options.html is html enabled
  * @param {boolean} options.futureDefaults is future defaults enabled
  * @param {string} options.uniqueName the unique name
  * @param {boolean} options.isNode is node target platform
@@ -801,6 +848,7 @@ const applyCssGeneratorOptionsDefaults = (
  * @param {HashSalt} options.hashSalt hash salt
  * @param {HashFunction} options.hashFunction hash function
  * @param {boolean} options.outputModule is output.module enabled
+ * @param {WebpackOptionsNormalized["output"]["library"]} options.library library options
  * @returns {void}
  */
 const applyModuleDefaults = (
@@ -812,6 +860,8 @@ const applyModuleDefaults = (
 		syncWebAssembly,
 		asyncWebAssembly,
 		css,
+		html,
+		typescript,
 		futureDefaults,
 		isNode,
 		uniqueName,
@@ -819,7 +869,8 @@ const applyModuleDefaults = (
 		mode,
 		deferImport,
 		sourceImport,
-		outputModule
+		outputModule,
+		library
 	}
 ) => {
 	if (cache) {
@@ -827,6 +878,7 @@ const applyModuleDefaults = (
 			module,
 			"unsafeCache",
 			/**
+			 * Handles the callback logic for this hook.
 			 * @param {Module} module module
 			 * @returns {boolean} true, if we want to cache the module
 			 */
@@ -880,11 +932,14 @@ const applyModuleDefaults = (
 			deferImport,
 			sourceImport,
 			isNode,
-			outputModule
+			outputModule,
+			library,
+			typescript
 		}
 	);
 
 	F(module.generator, "json", () => ({}));
+
 	applyJsonGeneratorOptionsDefaults(
 		/** @type {NonNullable<GeneratorOptionsByModuleTypeKnown["json"]>} */
 		(module.generator.json)
@@ -1027,6 +1082,16 @@ const applyModuleDefaults = (
 		}
 	}
 
+	if (html) {
+		// `module.generator.html.extract` is intentionally left undefined by
+		// default: HtmlGenerator treats undefined as "extract iff this HTML
+		// module is a compilation entry", which is the HTML-entry-point
+		// behaviour. Setting `extract: true` forces extraction for all HTML
+		// modules (including imported ones); `extract: false` disables it
+		// everywhere.
+		F(module.generator, HTML_MODULE_TYPE, () => ({}));
+	}
+
 	A(module, "defaultRules", () => {
 		const esm = {
 			type: JAVASCRIPT_MODULE_TYPE_ESM,
@@ -1084,6 +1149,7 @@ const applyModuleDefaults = (
 				...esm
 			}
 		];
+
 		if (asyncWebAssembly) {
 			const wasm = {
 				type: WEBASSEMBLY_MODULE_TYPE_ASYNC,
@@ -1129,6 +1195,7 @@ const applyModuleDefaults = (
 				...wasm
 			});
 		}
+
 		if (css) {
 			const resolve = {
 				fullySpecified: true,
@@ -1150,14 +1217,20 @@ const applyModuleDefaults = (
 				resolve
 			});
 			// For CSS modules, i.e. `.class { composes: className from "./style.css" }`
-			// We inherit for such constructions
+			// We inherit for such constructions, but skip files that are already
+			// detected as CSS modules by extension (`.module.<ext>`) — they get
+			// the same modules-mode behavior from the auto rule, and forcing a
+			// different type stamp here would create a duplicate module instance.
+			const moduleExtension = /\.module\.\w+$/i;
 			rules.push({
 				dependency: /css-import-local-module/,
+				exclude: moduleExtension,
 				type: CSS_MODULE_TYPE_MODULE,
 				resolve
 			});
 			rules.push({
 				dependency: /css-import-global-module/,
+				exclude: moduleExtension,
 				type: CSS_MODULE_TYPE_GLOBAL,
 				resolve
 			});
@@ -1179,6 +1252,72 @@ const applyModuleDefaults = (
 				}
 			);
 		}
+		if (html) {
+			const resolve = {
+				fullySpecified: true,
+				preferRelative: true
+			};
+
+			rules.push({
+				test: /\.html$/i,
+				type: HTML_MODULE_TYPE,
+				resolve
+			});
+			rules.push({
+				mimetype: "text/html",
+				type: HTML_MODULE_TYPE,
+				resolve
+			});
+			if (css) {
+				// Inline `<style>` content in an HTML module is fed into the
+				// CSS pipeline as a `data:text/css` virtual module. We force
+				// `exportType: "text"` so the CSS module exposes the
+				// processed CSS text on the `css-text` codegen channel that
+				// `HtmlInlineStyleDependency.Template` reads back into the
+				// `<style>` tag.
+				rules.push({
+					dependency: "html-style",
+					parser: {
+						exportType: "text"
+					},
+					resolve
+				});
+			}
+		}
+
+		if (typescript) {
+			rules.push(
+				{
+					test: /\.mts$/i,
+					...esm
+				},
+				{
+					test: /\.ts$/i,
+					descriptionData: {
+						type: "module"
+					},
+					...esm
+				},
+				{
+					test: /\.cts$/i,
+					...commonjs
+				},
+				{
+					test: /\.ts$/i,
+					descriptionData: {
+						type: "commonjs"
+					},
+					...commonjs
+				},
+				{
+					mimetype: {
+						or: ["text/typescript", "application/typescript"]
+					},
+					...esm
+				}
+			);
+		}
+
 		rules.push(
 			{
 				dependency: "url",
@@ -1216,6 +1355,7 @@ const applyModuleDefaults = (
 };
 
 /**
+ * Apply output defaults.
  * @param {Output} output options
  * @param {object} options options
  * @param {string} options.context context
@@ -1242,6 +1382,7 @@ const applyOutputDefaults = (
 	}
 ) => {
 	/**
+	 * Returns a readable library name.
 	 * @param {Library=} library the library option
 	 * @returns {string} a readable library name
 	 */
@@ -1293,11 +1434,13 @@ const applyOutputDefaults = (
 
 	const environment = /** @type {Environment} */ (output.environment);
 	/**
+	 * Returns true, when v is truthy or undefined.
 	 * @param {boolean | undefined} v value
 	 * @returns {boolean} true, when v is truthy or undefined
 	 */
 	const optimistic = (v) => v || v === undefined;
 	/**
+	 * Conditionally optimistic.
 	 * @param {boolean | undefined} v value
 	 * @param {boolean | undefined} c condition
 	 * @returns {boolean | undefined} true, when v is truthy or undefined, or c is truthy
@@ -1439,6 +1582,43 @@ const applyOutputDefaults = (
 		}
 		return "[id].css";
 	});
+	// Derive html filename defaults from `output.filename` / `output.chunkFilename`
+	// (the same shape the CSS pipeline uses), but if the derived template lacks
+	// any per-module differentiator, fall back to `[name].html` so multiple
+	// extracted HTML modules in one compilation don't collide on the same
+	// emitted file. For example: `output.filename: "bundle.js"` would derive
+	// `bundle.html` — two `.html` modules extracted in the same build would
+	// both want that name and conflict at emit time.
+	const HAS_PATH_PLACEHOLDER_REGEXP =
+		/\[(name|id|chunkhash|contenthash|fullhash|hash)/;
+	/**
+	 * @param {string} template html filename template derived from `output.filename`
+	 * @returns {string} same template, or `[name].html` if it has no per-module placeholder
+	 */
+	const ensureUniqueHtmlTemplate = (template) =>
+		HAS_PATH_PLACEHOLDER_REGEXP.test(template) ? template : "[name].html";
+	F(output, "htmlFilename", () => {
+		const filename =
+			/** @type {NonNullable<Output["htmlFilename"]>} */
+			(output.filename);
+		if (typeof filename !== "function") {
+			return ensureUniqueHtmlTemplate(
+				filename.replace(/\.[mc]?js(\?|$)/, ".html$1")
+			);
+		}
+		return "[name].html";
+	});
+	F(output, "htmlChunkFilename", () => {
+		const chunkFilename =
+			/** @type {NonNullable<Output["htmlChunkFilename"]>} */
+			(output.chunkFilename);
+		if (typeof chunkFilename !== "function") {
+			return ensureUniqueHtmlTemplate(
+				chunkFilename.replace(/\.[mc]?js(\?|$)/, ".html$1")
+			);
+		}
+		return "[name].html";
+	});
 	D(output, "assetModuleFilename", "[hash][ext][query][fragment]");
 	D(output, "webassemblyModuleFilename", "[hash].module.wasm");
 	D(output, "compareBeforeEmit", true);
@@ -1615,6 +1795,7 @@ const applyOutputDefaults = (
 	}
 
 	/**
+	 * Processes the provided fn.
 	 * @param {(entryDescription: EntryDescription) => void} fn iterator
 	 * @returns {void}
 	 */
@@ -1673,6 +1854,7 @@ const applyOutputDefaults = (
 };
 
 /**
+ * Apply externals presets defaults.
  * @param {ExternalsPresets} externalsPresets options
  * @param {object} options options
  * @param {TargetProperties | false} options.targetProperties target properties
@@ -1685,6 +1867,7 @@ const applyExternalsPresetsDefaults = (
 	{ targetProperties, buildHttp, outputModule }
 ) => {
 	/**
+	 * Checks whether this object is universal.
 	 * @param {keyof TargetProperties} key a key
 	 * @returns {boolean} true when target is universal, otherwise false
 	 */
@@ -1752,6 +1935,7 @@ const applyExternalsPresetsDefaults = (
 };
 
 /**
+ * Apply loader defaults.
  * @param {Loader} loader options
  * @param {object} options options
  * @param {TargetProperties | false} options.targetProperties target properties
@@ -1776,6 +1960,7 @@ const applyLoaderDefaults = (loader, { targetProperties, environment }) => {
 };
 
 /**
+ * Apply node defaults.
  * @param {WebpackNode} node options
  * @param {object} options options
  * @param {TargetProperties | false} options.targetProperties target properties
@@ -1821,6 +2006,7 @@ const applyNodeDefaults = (
 };
 
 /**
+ * Apply performance defaults.
  * @param {Performance} performance options
  * @param {object} options options
  * @param {boolean} options.production is production
@@ -1834,6 +2020,7 @@ const applyPerformanceDefaults = (performance, { production }) => {
 };
 
 /**
+ * Apply optimization defaults.
  * @param {Optimization} optimization options
  * @param {object} options options
  * @param {boolean} options.production is production
@@ -1931,12 +2118,14 @@ const applyOptimizationDefaults = (
 };
 
 /**
+ * Gets resolve defaults.
  * @param {object} options options
  * @param {boolean} options.cache is cache enable
  * @param {string} options.context build context
  * @param {TargetProperties | false} options.targetProperties target properties
  * @param {Mode} options.mode mode
  * @param {boolean} options.css is css enabled
+ * @param {boolean} options.typescript is typescript enabled
  * @returns {ResolveOptions} resolve options
  */
 const getResolveDefaults = ({
@@ -1944,7 +2133,8 @@ const getResolveDefaults = ({
 	context,
 	targetProperties,
 	mode,
-	css
+	css,
+	typescript
 }) => {
 	/** @type {string[]} */
 	const conditions = ["webpack"];
@@ -1959,24 +2149,43 @@ const getResolveDefaults = ({
 		if (targetProperties.nwjs) conditions.push("nwjs");
 	}
 
-	const jsExtensions = [".js", ".json", ".wasm"];
+	const jsExtensions = typescript
+		? [".ts", ".js", ".json", ".wasm"]
+		: [".js", ".json", ".wasm"];
 
 	const tp = targetProperties;
 	const browserField =
 		tp && tp.web && (!tp.node || (tp.electron && tp.electronRenderer));
 
+	// When `experiments.typescript` is on, also honor the `typescript`
+	// conditional-exports key so monorepo packages can ship .ts sources via
+	// `package.json#exports` — same convention Node.js's amaro uses.
+	const tsConditionPrefix = typescript ? ["typescript"] : [];
+
 	/** @type {() => ResolveOptions} */
 	const cjsDeps = () => ({
 		aliasFields: browserField ? ["browser"] : [],
 		mainFields: browserField ? ["browser", "module", "..."] : ["module", "..."],
-		conditionNames: ["require", "module", "..."],
+		conditionNames: [
+			...tsConditionPrefix,
+			"require",
+			"module-sync",
+			"module",
+			"..."
+		],
 		extensions: [...jsExtensions]
 	});
 	/** @type {() => ResolveOptions} */
 	const esmDeps = () => ({
 		aliasFields: browserField ? ["browser"] : [],
 		mainFields: browserField ? ["browser", "module", "..."] : ["module", "..."],
-		conditionNames: ["import", "module", "..."],
+		conditionNames: [
+			...tsConditionPrefix,
+			"import",
+			"module-sync",
+			"module",
+			"..."
+		],
 		extensions: [...jsExtensions]
 	});
 
@@ -2057,10 +2266,20 @@ const getResolveDefaults = ({
 			cssResolveOptions;
 	}
 
+	if (typescript) {
+		resolveOptions.tsconfig = true;
+		resolveOptions.extensionAlias = {
+			".js": [".js", ".ts"],
+			".cjs": [".cjs", ".cts"],
+			".mjs": [".mjs", ".mts"]
+		};
+	}
+
 	return resolveOptions;
 };
 
 /**
+ * Gets resolve loader defaults.
  * @param {object} options options
  * @param {boolean} options.cache is cache enable
  * @returns {ResolveOptions} resolve options
@@ -2080,6 +2299,7 @@ const getResolveLoaderDefaults = ({ cache }) => {
 };
 
 /**
+ * Apply infrastructure logging defaults.
  * @param {InfrastructureLogging} infrastructureLogging options
  * @returns {void}
  */