@depup/webpack 5.109.0-depup.0 → 5.110.1-depup.0

package/lib/html/HtmlModulesPlugin.js

@@ -14,12 +14,8 @@ const HotUpdateChunk = require("../HotUpdateChunk");
 const { HTML_TYPE } = require("../ModuleSourceTypeConstants");
 const { HTML_MODULE_TYPE } = require("../ModuleTypeConstants");
 const NormalModule = require("../NormalModule");
+const { toTemplateSourceFileName } = require("../TemplatedPathPlugin");
 const ConstDependency = require("../dependencies/ConstDependency");
-const HtmlEntryDependency = require("../dependencies/HtmlEntryDependency");
-const HtmlInlineHtmlDependency = require("../dependencies/HtmlInlineHtmlDependency");
-const HtmlInlineScriptDependency = require("../dependencies/HtmlInlineScriptDependency");
-const HtmlInlineStyleDependency = require("../dependencies/HtmlInlineStyleDependency");
-const HtmlSourceDependency = require("../dependencies/HtmlSourceDependency");
 const StaticExportsDependency = require("../dependencies/StaticExportsDependency");
 const WebpackError = require("../errors/WebpackError");
 const JavascriptModulesPlugin = require("../javascript/JavascriptModulesPlugin");
@@ -28,24 +24,40 @@ const createHash = require("../util/createHash");
 const createHooksRegistry = require("../util/createHooksRegistry");
 const { getUndoPath, makePathsRelative } = require("../util/identifier");
 const implicitTypeLoaderFallback = require("../util/implicitTypeLoaderFallback");
+const lazyModule = require("../util/lazyModule");
 const memoize = require("../util/memoize");
 const { digestNonNumericOnly } = require("../util/nonNumericOnlyHash");
+const preloadModuleType = require("../util/preloadModuleType");
 const {
 	PUBLIC_PATH_AUTO: autoPlaceholder
 } = require("../util/publicPathPlaceholder");
 const removeBOM = require("../util/removeBOM");
-const HtmlGenerator = require("./HtmlGenerator");
 const HtmlModule = require("./HtmlModule");
-const HtmlParser = require("./HtmlParser");
-const { escapeAttribute } = require("./syntax");
 
-/** @typedef {import("../../declarations/WebpackOptions").EntryDescriptionNormalized} EntryDescriptionNormalized */
+const getMimeTypes = memoize(() => require("../util/mimeTypes"));
+
+const getHtmlSyntax = memoize(() => require("./syntax"));
+
+// Lazy: this plugin is applied on every build (`experiments.html` defaults on),
+// but the HTML parser and tokenizer are only reached once HTML is in the graph.
+const getHtmlParser = lazyModule(() => require("./HtmlParser"));
+
+// html generation only happens once a build actually has an html module
+const getHtmlGenerator = memoize(() => require("./HtmlGenerator"));
+
+/**
+ * @import {
+ * 	EntryDescriptionNormalized,
+ * 	OutputHtmlOptions,
+ * 	HtmlFaviconIcon
+ * } from "../../declarations/WebpackOptions"
+ */
 /** @typedef {import("../../declarations/WebpackOptions").OutputHtmlOptions["favicon"]} FaviconOption */
 /** @typedef {import("../../declarations/WebpackOptions").OutputHtmlOptions["manifest"]} ManifestOption */
-/** @typedef {import("../../declarations/WebpackOptions").HtmlFaviconIcon} HtmlFaviconIcon */
 /** @typedef {Exclude<HtmlFaviconIcon, string>} FaviconIcon */
-/** @typedef {import("../Compiler")} Compiler */
-/** @typedef {import("./HtmlModule").HtmlModuleBuildInfo} HtmlModuleBuildInfo */
+/** @import Compiler from "../Compiler" */
+/** @import { HtmlModuleBuildInfo } from "./HtmlModule" */
+/** @import HtmlParser from "./HtmlParser" */
 /** @typedef {{ request: string, entryName: string, type: "script" | "script-module" | "modulepreload" | "stylesheet" | "html" | "preload" | "prefetch", css?: boolean }} HtmlEntryInfo */
 
 /** @typedef {{ outputName: string }} HtmlTransformHtmlContext */
@@ -72,12 +84,36 @@ const { escapeAttribute } = require("./syntax");
  * @property {boolean=} remove set true to delete the whole element
  */
 /** @typedef {{ outputName: string, html: string }} HtmlTransformTagsContext */
+
+const createCompilationHooks = () => ({
+	/**
+	 * Called with the list of extra tags to inject into each page (initially empty) plus the current HTML; push `HtmlTagDescriptor`s and return the list — webpack serializes and places them by `injectTo`. A structured alternative to the string-level `transformHtml` for adding tags; runs before CSP so injected inline tags are hashed.
+	 * @type {AsyncSeriesWaterfallHook<[HtmlTagDescriptor[], HtmlInjectTagsContext]>}
+	 * @since 5.109.0
+	 */
+	injectTags: new AsyncSeriesWaterfallHook(["tags", "context"]),
+	/**
+	 * Called with the page's `<script>`/`<link>`/`<style>`/`<meta>` tags (webpack's own and any injected) as mutable descriptors; mutate `attrs` (add a `nonce`/`data-*`, switch `defer`↔`async`, …), set `remove: true`, or change `injectTo` to move a tag between `<head>` and `<body>`, and webpack rewrites the changed tags. Add new tags with `injectTags` instead.
+	 * @type {AsyncSeriesHook<[HtmlMutableTag[], HtmlTransformTagsContext]>}
+	 * @since 5.109.0
+	 */
+	transformTags: new AsyncSeriesHook(["tags", "context"]),
+	/**
+	 * Called with each emitted page's final HTML (all sentinels resolved) just before it is written; return the (possibly transformed) HTML — e.g. to minify, inject a CSP meta, or rewrite tags.
+	 * @type {AsyncSeriesWaterfallHook<[string, HtmlTransformHtmlContext]>}
+	 * @since 5.109.0
+	 */
+	transformHtml: new AsyncSeriesWaterfallHook(["html", "context"]),
+	/**
+	 * Called once each page's HTML asset has been finalized — a post-emit notification (nothing to return).
+	 * @type {AsyncSeriesHook<[HtmlEmittedContext]>}
+	 * @since 5.109.0
+	 */
+	htmlEmitted: new AsyncSeriesHook(["context"])
+});
+
 /**
- * @typedef {object} HtmlCompilationHooks
- * @property {AsyncSeriesWaterfallHook<[HtmlTagDescriptor[], HtmlInjectTagsContext]>} injectTags called with the list of extra tags to inject into each page (initially empty) plus the current HTML; push `HtmlTagDescriptor`s and return the list — webpack serializes and places them by `injectTo`. A structured alternative to the string-level `transformHtml` for adding tags; runs before CSP so injected inline tags are hashed
- * @property {AsyncSeriesHook<[HtmlMutableTag[], HtmlTransformTagsContext]>} transformTags called with the page's `<script>`/`<link>`/`<style>`/`<meta>` tags (webpack's own and any injected) as mutable descriptors; mutate `attrs` (add a `nonce`/`data-*`, switch `defer`↔`async`, …), set `remove: true`, or change `injectTo` to move a tag between `<head>` and `<body>`, and webpack rewrites the changed tags. Add new tags with `injectTags` instead
- * @property {AsyncSeriesWaterfallHook<[string, HtmlTransformHtmlContext]>} transformHtml called with each emitted page's final HTML (all sentinels resolved) just before it is written; return the (possibly transformed) HTML — e.g. to minify, inject a CSP meta, or rewrite tags
- * @property {AsyncSeriesHook<[HtmlEmittedContext]>} htmlEmitted called once each page's HTML asset has been finalized — a post-emit notification (nothing to return)
+ * @typedef {ReturnType<typeof createCompilationHooks>} HtmlCompilationHooks
  */
 
 const PLUGIN_NAME = "HtmlModulesPlugin";
@@ -90,7 +126,6 @@ const DEFAULT_FAVICON = new URL("./favicon.svg", pathToFileURL(__filename))
 	.href;
 
 // mime-db is heavy — only load it when a favicon actually needs a `type`.
-const getMimeTypes = memoize(() => require("../util/mimeTypes"));
 
 /**
  * Resolves `output.html.favicon` for one page to `[rel, icon]` pairs.
@@ -126,6 +161,7 @@ const resolveFaviconLinks = (favicon, name) => {
  * @returns {string} a `<link rel=… [attrs…] href=…>` tag; `type` defaults to the file format
  */
 const faviconLinkTag = (rel, icon) => {
+	const { escapeAttribute } = getHtmlSyntax();
 	const type = icon.type || getMimeTypes().lookup(icon.href) || "";
 	const attrs = [
 		`rel="${escapeAttribute(rel)}"`,
@@ -162,9 +198,27 @@ const manifestLinkTag = (manifest, name) => {
 					JSON.stringify(value),
 					"utf8"
 				).toString("base64")}`;
-	return `<link rel="manifest" href="${escapeAttribute(href)}">`;
+	return `<link rel="manifest" href="${getHtmlSyntax().escapeAttribute(
+		href
+	)}">`;
 };
 
+// Decided while the page's HTML is generated, which happens once per module —
+// and one synthetic page module can back several entries — so an entry's `html`
+// object can't override it.
+/** @type {"inline"[]} */
+const GLOBAL_ONLY_HTML_OPTIONS = ["inline"];
+
+/**
+ * SRI is on when `integrity` names at least one algorithm.
+ * @param {OutputHtmlOptions["integrity"]} integrity integrity option
+ * @returns {boolean} true when integrity attributes must be emitted
+ */
+const isIntegrityEnabled = (integrity) =>
+	integrity === true ||
+	typeof integrity === "function" ||
+	(Array.isArray(integrity) && integrity.length > 0);
+
 // `\.html`/`\.css` request matchers for the synthetic `output.html` wrapper.
 const HTML_REQUEST_RE = /\.html(\?|$)/i;
 const CSS_REQUEST_RE = /\.css(\?|$)/i;
@@ -275,25 +329,59 @@ class HtmlModulesPlugin {
 	apply(compiler) {
 		const { output } = compiler.options;
 		const htmlOption = output.html;
-		const scriptLoading =
-			(typeof htmlOption === "object" && htmlOption.scriptLoading) || "auto";
-		// ESM output emits `type="module"` (already deferred), so scriptLoading
-		// is ignored under output.module — warn on an explicit defer/blocking.
-		let scriptAttr = " defer";
-		if (output.module) {
-			scriptAttr = "";
-			if (scriptLoading === "defer" || scriptLoading === "blocking") {
-				compiler.hooks.thisCompilation.tap(PLUGIN_NAME, (compilation) => {
-					compilation.warnings.push(
-						new WebpackError(
-							`output.html.scriptLoading: "${scriptLoading}" is ignored with output.module — ES module scripts are always deferred.`
-						)
-					);
-				});
+		const globalHtmlOptions =
+			typeof htmlOption === "object" ? htmlOption : undefined;
+		// Collected while entries are resolved (`entryOption`, before the first
+		// compilation) and reported on every compilation; a Set dedupes entries
+		// that hit the same problem.
+		/** @type {Set<string>} */
+		const optionWarnings = new Set();
+		compiler.hooks.thisCompilation.tap(PLUGIN_NAME, (compilation) => {
+			for (const message of optionWarnings) {
+				compilation.warnings.push(new WebpackError(message));
 			}
-		} else if (scriptLoading === "blocking") {
-			scriptAttr = "";
-		}
+		});
+
+		// Resolved options per entry that owns a generated page, read back when the
+		// page is emitted (`csp`, `integrity`) — one synthetic page module can back
+		// several entries, so those can only be applied per emitted asset.
+		/** @type {Map<string, OutputHtmlOptions>} */
+		const htmlOptionsByEntry = new Map();
+		// SRI sentinels are emitted while the page's HTML is generated, before the
+		// owning entry is known, so any page asking for integrity turns them on for
+		// all of them; pages that don't want SRI drop them again on emit. Authored
+		// `.html` pages never reach the entry hook, hence the global seed.
+		let anyIntegrity = isIntegrityEnabled(
+			globalHtmlOptions && globalHtmlOptions.integrity
+		);
+
+		/**
+		 * Options for one page: an entry's `html` object overrides `output.html`
+		 * option by option, `true` inherits it as-is.
+		 * @param {EntryDescriptionNormalized["html"]} html the entry's `html` value
+		 * @param {string} name entry name
+		 * @returns {OutputHtmlOptions} resolved options
+		 */
+		const resolveHtmlOptions = (html, name) => {
+			const options =
+				typeof html !== "object"
+					? globalHtmlOptions || {}
+					: globalHtmlOptions
+						? { ...globalHtmlOptions, ...html }
+						: html;
+			if (typeof html === "object") {
+				for (const option of GLOBAL_ONLY_HTML_OPTIONS) {
+					if (html[option] !== undefined) {
+						optionWarnings.add(
+							`entry "${name}" html.${option} is ignored — ${option} is resolved once per generated page and can only be set on output.html.`
+						);
+					}
+				}
+			}
+			htmlOptionsByEntry.set(name, options);
+			if (isIntegrityEnabled(options.integrity)) anyIntegrity = true;
+			return options;
+		};
 
 		// `output.html` (or an entry's `html`) wraps a non-HTML entry in a
 		// synthetic HTML module so the existing pipeline injects its JS/CSS
@@ -305,6 +393,9 @@ class HtmlModulesPlugin {
 		EntryOptionPlugin.getHooks(compiler).entry.tap(
 			PLUGIN_NAME,
 			(context, name, desc) => {
+				// Resolved for every entry, including the authored `.html` ones that
+				// need no wrapper below — their page reads back `csp`/`integrity` too.
+				const htmlObj = resolveHtmlOptions(desc.html, name);
 				const html = desc.html !== undefined ? desc.html : htmlOption;
 				const imports = desc.import;
 				if (
@@ -314,6 +405,26 @@ class HtmlModulesPlugin {
 				) {
 					return;
 				}
+				const scriptLoading = htmlObj.scriptLoading || "auto";
+				// ESM output emits `type="module"` (already deferred), so
+				// scriptLoading is ignored under output.module — warn on an
+				// explicit defer/blocking.
+				let scriptAttr = " defer";
+				if (output.module) {
+					scriptAttr = "";
+					if (scriptLoading === "defer" || scriptLoading === "blocking") {
+						const source =
+							typeof desc.html === "object" &&
+							desc.html.scriptLoading !== undefined
+								? `entry "${name}" html`
+								: "output.html";
+						optionWarnings.add(
+							`${source}.scriptLoading: "${scriptLoading}" is ignored with output.module — ES module scripts are always deferred.`
+						);
+					}
+				} else if (scriptLoading === "blocking") {
+					scriptAttr = "";
+				}
 				const entries = compiler.options.entry;
 				const requests =
 					typeof entries === "object" && entries[name]
@@ -328,27 +439,13 @@ class HtmlModulesPlugin {
 						scripts.push(`<script${scriptAttr} src="${r}"></script>`);
 					}
 				}
-				const htmlObj =
-					typeof html === "object"
-						? html
-						: typeof htmlOption === "object"
-							? htmlOption
-							: {};
-				const headTags = HtmlParser.buildHeadTags(htmlObj);
+				const headTags = getHtmlSyntax().buildHeadTags(htmlObj);
 				// Injected into webpack-generated pages only; each icon's href is a
 				// normal request the parser turns into a hashed asset.
-				const favicon =
-					typeof html === "object" && html.favicon !== undefined
-						? html.favicon
-						: false;
-				const faviconTag = resolveFaviconLinks(favicon, name)
+				const faviconTag = resolveFaviconLinks(htmlObj.favicon, name)
 					.map(([rel, icon]) => faviconLinkTag(rel, icon))
 					.join("");
-				const manifest =
-					typeof html === "object" && html.manifest !== undefined
-						? html.manifest
-						: false;
-				const manifestTag = manifestLinkTag(manifest, name);
+				const manifestTag = manifestLinkTag(htmlObj.manifest, name);
 				const inject = htmlObj.inject;
 				const scriptsInHead =
 					inject === "head" || (inject !== "body" && output.module);
@@ -378,12 +475,13 @@ class HtmlModulesPlugin {
 		// `<link rel="modulepreload">` intact.
 		// Per-compilation state: the HTML modules seen during make (so
 		// `finishMake` creates their entries without scanning the whole module
-		// graph) and the stylesheet entry names (read in `afterChunks`).
-		/** @type {WeakMap<import("../Compilation"), { htmlModules: Set<import("../Module")>, stylesheetEntries: Set<string>, htmlAssetNames: Set<string> }>} */
+		// graph), the stylesheet entry names (read in `afterChunks`) and the html
+		// options of every emitted page, keyed by its asset name.
+		/** @type {WeakMap<import("../Compilation"), { htmlModules: Set<import("../Module")>, stylesheetEntries: Set<string>, htmlAssetOptions: Map<string, OutputHtmlOptions> }>} */
 		const compilationState = new WeakMap();
 		/**
 		 * @param {import("../Compilation")} compilation compilation
-		 * @returns {{ htmlModules: Set<import("../Module")>, stylesheetEntries: Set<string>, htmlAssetNames: Set<string> }} per-compilation state
+		 * @returns {{ htmlModules: Set<import("../Module")>, stylesheetEntries: Set<string>, htmlAssetOptions: Map<string, OutputHtmlOptions> }} per-compilation state
 		 */
 		const getState = (compilation) => {
 			let state = compilationState.get(compilation);
@@ -391,7 +489,7 @@ class HtmlModulesPlugin {
 				state = {
 					htmlModules: new Set(),
 					stylesheetEntries: new Set(),
-					htmlAssetNames: new Set()
+					htmlAssetOptions: new Map()
 				};
 				compilationState.set(compilation, state);
 			}
@@ -491,15 +589,10 @@ class HtmlModulesPlugin {
 			);
 		});
 
-		const integrity =
-			typeof htmlOption === "object" ? htmlOption.integrity : undefined;
-		const integrityOn =
-			integrity === true ||
-			typeof integrity === "function" ||
-			(Array.isArray(integrity) && integrity.length > 0);
-		// `output.html.csp` injects a `<meta http-equiv="Content-Security-Policy">`
-		// once the page's inline content is final (in `processAssets` below).
-		const csp = typeof htmlOption === "object" ? htmlOption.csp : undefined;
+		// `csp` injects a `<meta http-equiv="Content-Security-Policy">` and
+		// `integrity` resolves the SRI sentinels — both once the page's inline
+		// content is final (in `processAssets` below), per page, so an entry's
+		// `html` can override them.
 		// `"auto"` marks implicit enablement (no user rule for HTML files) — see
 		// `applyExperimentsDefaults`. Only then loaders win over the built-in type
 		// (e.g. html-webpack-plugin's template loader in its child compiler).
@@ -523,7 +616,13 @@ class HtmlModulesPlugin {
 				// module in the graph. Tracking only records; entries are still
 				// added (and awaited) in `finishMake`.
 				const trackHtmlModule = (/** @type {import("../Module")} */ module) => {
-					if (module.type === HTML_MODULE_TYPE) htmlModules.add(module);
+					if (module.type !== HTML_MODULE_TYPE) return;
+					// enabled here, not on the compilation hook: an integrity build
+					// with no html module must not load the generator
+					if (anyIntegrity) {
+						getHtmlGenerator().enableIntegritySentinels(compilation);
+					}
+					htmlModules.add(module);
 				};
 				compilation.hooks.succeedModule.tap(PLUGIN_NAME, trackHtmlModule);
 				compilation.hooks.stillValidModule.tap(PLUGIN_NAME, trackHtmlModule);
@@ -535,7 +634,7 @@ class HtmlModulesPlugin {
 				// with CORS; without `output.crossOriginLoading` the browser
 				// silently ignores `integrity` on cross-origin loads. Warn once
 				// so a CDN deployment doesn't ship no-op integrity attributes.
-				if (integrityOn && !compilation.outputOptions.crossOriginLoading) {
+				if (anyIntegrity && !compilation.outputOptions.crossOriginLoading) {
 					compilation.warnings.push(
 						new WebpackError(
 							'output.html.integrity is set but output.crossOriginLoading is not. Browsers ignore Subresource Integrity on cross-origin requests made without CORS; set output.crossOriginLoading (e.g. "anonymous") if any asset is served from a different origin.'
@@ -548,29 +647,32 @@ class HtmlModulesPlugin {
 						stage: Compilation.PROCESS_ASSETS_STAGE_OPTIMIZE_HASH + 1
 					},
 					async (assets) => {
-						const { htmlAssetNames } = getState(compilation);
+						const { htmlAssetOptions } = getState(compilation);
 						const hooks = HtmlModulesPlugin.getCompilationHooks(compilation);
 						/** @type {Set<string>} */
 						const inlinedFiles = new Set();
 						for (const name of Object.keys(assets)) {
-							if (!htmlAssetNames.has(name)) continue;
+							const pageOptions = htmlAssetOptions.get(name);
+							if (pageOptions === undefined) continue;
 							const content = assets[name].source();
 							if (typeof content !== "string") continue;
+							const { csp, integrity } = pageOptions;
 							let resolved = content;
-							if (
-								integrityOn &&
-								resolved.includes("__WEBPACK_HTML_INTEGRITY__")
-							) {
-								resolved = HtmlGenerator.resolveChunkIntegritySentinels(
-									resolved,
-									compilation,
-									/** @type {import("./HtmlGenerator").HtmlIntegrity} */ (
-										integrity
-									)
-								);
+							// Sentinels are emitted whenever any page wants SRI, so a page
+							// that doesn't drops them again here.
+							if (resolved.includes("__WEBPACK_HTML_INTEGRITY__")) {
+								resolved = isIntegrityEnabled(integrity)
+									? getHtmlGenerator().resolveChunkIntegritySentinels(
+											resolved,
+											compilation,
+											/** @type {import("./HtmlGenerator").HtmlIntegrity} */ (
+												integrity
+											)
+										)
+									: getHtmlGenerator().stripChunkIntegritySentinels(resolved);
 							}
 							if (resolved.includes("__WEBPACK_HTML_INLINE__")) {
-								resolved = HtmlGenerator.resolveChunkInlineSentinels(
+								resolved = getHtmlGenerator().resolveChunkInlineSentinels(
 									resolved,
 									compilation,
 									name,
@@ -589,15 +691,15 @@ class HtmlModulesPlugin {
 							});
 							const transformTags = hooks.transformTags.taps.length > 0;
 							if (injected.length > 0 || transformTags || csp) {
-								const model = HtmlGenerator.collectHtml(resolved);
-								HtmlGenerator.addInjectedTags(model, injected);
+								const model = getHtmlGenerator().collectHtml(resolved);
+								getHtmlGenerator().addInjectedTags(model, injected);
 								if (transformTags) {
 									await hooks.transformTags.promise(model.tags, {
 										outputName: name,
 										html: resolved
 									});
 								}
-								resolved = HtmlGenerator.renderHtml(resolved, model, csp);
+								resolved = getHtmlGenerator().renderHtml(resolved, model, csp);
 							}
 							// Final, fully-resolved HTML — let plugins transform it (minify,
 							// inject a CSP meta, rewrite tags) before it is written.
@@ -671,58 +773,6 @@ class HtmlModulesPlugin {
 							compilation.outputOptions.cssChunkFilename;
 					}
 				});
-				compilation.dependencyFactories.set(
-					HtmlSourceDependency,
-					normalModuleFactory
-				);
-				compilation.dependencyTemplates.set(
-					HtmlSourceDependency,
-					new HtmlSourceDependency.Template()
-				);
-				compilation.dependencyFactories.set(
-					HtmlEntryDependency,
-					normalModuleFactory
-				);
-				compilation.dependencyTemplates.set(
-					HtmlEntryDependency,
-					new HtmlEntryDependency.Template()
-				);
-				// Inline `<script>` content is bundled as its own entry — the
-				// same pipeline that handles `<script src>` — via a
-				// `data:text/javascript,...` request. The dependency
-				// template rewrites the original tag to `<script src=…>`.
-				compilation.dependencyFactories.set(
-					HtmlInlineScriptDependency,
-					normalModuleFactory
-				);
-				compilation.dependencyTemplates.set(
-					HtmlInlineScriptDependency,
-					new HtmlInlineScriptDependency.Template()
-				);
-				// Inline `<style>` content is routed through the CSS pipeline
-				// as a `data:text/css` module. The dependency template reads
-				// the processed CSS text from the CSS module's code
-				// generation data (`css-text` channel set by CssGenerator
-				// when `exportType` is `"text"`).
-				compilation.dependencyFactories.set(
-					HtmlInlineStyleDependency,
-					normalModuleFactory
-				);
-				compilation.dependencyTemplates.set(
-					HtmlInlineStyleDependency,
-					new HtmlInlineStyleDependency.Template()
-				);
-				// `<iframe srcdoc>` content is routed back through the HTML
-				// pipeline as a `data:text/html` module; the template reads the
-				// processed HTML from the nested module's `html` channel.
-				compilation.dependencyFactories.set(
-					HtmlInlineHtmlDependency,
-					normalModuleFactory
-				);
-				compilation.dependencyTemplates.set(
-					HtmlInlineHtmlDependency,
-					new HtmlInlineHtmlDependency.Template()
-				);
 				compilation.dependencyTemplates.set(
 					StaticExportsDependency,
 					new StaticExportsDependency.Template()
@@ -735,6 +785,74 @@ class HtmlModulesPlugin {
 					ConstDependency,
 					new ConstDependency.Template()
 				);
+				// registered when the first html module is prepared, so a build
+				// without html never loads these dependency classes
+				normalModuleFactory.hooks.prepareModuleType
+					.for(HTML_MODULE_TYPE)
+					.tap(PLUGIN_NAME, () => {
+						const HtmlSourceDependency = require("../dependencies/HtmlSourceDependency");
+						const HtmlEntryDependency = require("../dependencies/HtmlEntryDependency");
+						const HtmlInlineScriptDependency = require("../dependencies/HtmlInlineScriptDependency");
+						const HtmlInlineStyleDependency = require("../dependencies/HtmlInlineStyleDependency");
+						const HtmlInlineHtmlDependency = require("../dependencies/HtmlInlineHtmlDependency");
+
+						compilation.dependencyFactories.set(
+							HtmlSourceDependency,
+							normalModuleFactory
+						);
+						compilation.dependencyTemplates.set(
+							HtmlSourceDependency,
+							new HtmlSourceDependency.Template()
+						);
+						compilation.dependencyFactories.set(
+							HtmlEntryDependency,
+							normalModuleFactory
+						);
+						compilation.dependencyTemplates.set(
+							HtmlEntryDependency,
+							new HtmlEntryDependency.Template()
+						);
+						// Inline `<script>` content is bundled as its own entry — the
+						// same pipeline that handles `<script src>` — via a
+						// `data:text/javascript,...` request. The dependency
+						// template rewrites the original tag to `<script src=…>`.
+						compilation.dependencyFactories.set(
+							HtmlInlineScriptDependency,
+							normalModuleFactory
+						);
+						compilation.dependencyTemplates.set(
+							HtmlInlineScriptDependency,
+							new HtmlInlineScriptDependency.Template()
+						);
+						// Inline `<style>` content is routed through the CSS pipeline
+						// as a `data:text/css` module. The dependency template reads
+						// the processed CSS text from the CSS module's code
+						// generation data (`css-text` channel set by CssGenerator
+						// when `exportType` is `"text"`).
+						compilation.dependencyFactories.set(
+							HtmlInlineStyleDependency,
+							normalModuleFactory
+						);
+						compilation.dependencyTemplates.set(
+							HtmlInlineStyleDependency,
+							new HtmlInlineStyleDependency.Template()
+						);
+						// `<iframe srcdoc>` content is routed back through the HTML
+						// pipeline as a `data:text/html` module; the template reads the
+						// processed HTML from the nested module's `html` channel.
+						compilation.dependencyFactories.set(
+							HtmlInlineHtmlDependency,
+							normalModuleFactory
+						);
+						compilation.dependencyTemplates.set(
+							HtmlInlineHtmlDependency,
+							new HtmlInlineHtmlDependency.Template()
+						);
+					});
+				preloadModuleType(normalModuleFactory, PLUGIN_NAME, [
+					[HTML_MODULE_TYPE, [getHtmlParser]]
+				]);
+
 				normalModuleFactory.hooks.createModuleClass
 					.for(HTML_MODULE_TYPE)
 					.tap(
@@ -753,7 +871,7 @@ class HtmlModulesPlugin {
 									options
 								)
 						);
-						return new HtmlParser(parserOptions);
+						return new (getHtmlParser.loaded())(parserOptions);
 					});
 
 				normalModuleFactory.hooks.createGenerator
@@ -768,7 +886,10 @@ class HtmlModulesPlugin {
 									options
 								)
 						);
-						return new HtmlGenerator(generatorOptions, compilation.moduleGraph);
+						return new (getHtmlGenerator())(
+							generatorOptions,
+							compilation.moduleGraph
+						);
 					});
 
 				NormalModule.getCompilationHooks(compilation).processResult.tap(
@@ -848,9 +969,9 @@ class HtmlModulesPlugin {
 						// Asset URL sentinels (from `HtmlEntryDependency` resource-hint
 						// tags) resolve here too — deferred from template.apply so it
 						// doesn't race with asset-module codegen.
-						const resolvedContent = HtmlGenerator.resolveAssetUrlSentinels(
-							HtmlGenerator.embedInlineChunkHashes(
-								HtmlGenerator.resolveChunkUrlSentinels(
+						const resolvedContent = getHtmlGenerator().resolveAssetUrlSentinels(
+							getHtmlGenerator().embedInlineChunkHashes(
+								getHtmlGenerator().resolveChunkUrlSentinels(
 									/** @type {string} */ (placeholderSource.source()),
 									compilation
 								),
@@ -873,11 +994,14 @@ class HtmlModulesPlugin {
 					const sourceFilename =
 						resource.startsWith("data:text/html") && chunk.name
 							? chunk.name
-							: makePathsRelative(
-									compiler.context,
-									/** @type {string} */ (resource),
-									compiler.root
-								).replace(/^\.\//, "");
+							: toTemplateSourceFileName(
+									makePathsRelative(
+										compiler.context,
+										/** @type {string} */ (resource),
+										compiler.root
+									).replace(/^\.\//, ""),
+									compilation
+								);
 					const filenameTemplate = HtmlModulesPlugin.getChunkFilenameTemplate(
 						chunk,
 						outputOptions
@@ -988,10 +1112,11 @@ class HtmlModulesPlugin {
 							// Resolve linked-page (`type: "html"`) sentinels to each page's
 							// emitted filename before the undo path, so the href is relative to
 							// this page.
-							const finalContent = HtmlGenerator.resolveHtmlPageUrlSentinels(
-								resolvedContent,
-								computePageFilenameByEntry
-							)
+							const finalContent = getHtmlGenerator()
+								.resolveHtmlPageUrlSentinels(
+									resolvedContent,
+									computePageFilenameByEntry
+								)
 								.split(autoPlaceholder)
 								.join(undoPath);
 							const finalSource = new RawSource(finalContent);
@@ -1009,8 +1134,14 @@ class HtmlModulesPlugin {
 											outputOptions
 										);
 
-							// Track HTML pages for the integrity sentinel pass (never JS chunks).
-							getState(compilation).htmlAssetNames.add(filename);
+							// Track HTML pages (never JS chunks) with the html options of the
+							// entry that owns them, read back by the emit passes below.
+							getState(compilation).htmlAssetOptions.set(
+								filename,
+								(chunk.name && htmlOptionsByEntry.get(chunk.name)) ||
+									globalHtmlOptions ||
+									{}
+							);
 
 							result.push({
 								render: () => finalSource,
@@ -1036,6 +1167,13 @@ class HtmlModulesPlugin {
 					if (htmlModules.size === 0) return source;
 					const raw = source.source();
 					if (typeof raw !== "string") return source;
+					// Every sentinel shares this prefix — one scan answers the common
+					// sentinel-free case instead of five.
+					if (!raw.includes("__WEBPACK_HTML_")) {
+						return source;
+					}
+					// Exact re-check on a prefix hit: the autoPlaceholder strip below is
+					// not sentinel-guarded, so bare-prefix false positives must bail here.
 					if (
 						!raw.includes("__WEBPACK_HTML_CHUNK_URL__") &&
 						!raw.includes("__WEBPACK_HTML_PAGE_URL__") &&
@@ -1048,20 +1186,26 @@ class HtmlModulesPlugin {
 					// Strip integrity and inline sentinels (not resolve): a JS chunk
 					// can't hold real SRI hashes for its own not-yet-final bytes, and
 					// inline content belongs only in the final .html, never in JS bundles.
-					const resolved = HtmlGenerator.stripChunkIntegritySentinels(
-						HtmlGenerator.resolveAssetUrlSentinels(
-							HtmlGenerator.resolveHtmlPageUrlSentinels(
-								HtmlGenerator.resolveChunkUrlSentinels(raw, compilation),
-								computePageFilenameByEntry
-							),
-							compilation
+					const resolved = getHtmlGenerator()
+						.stripChunkIntegritySentinels(
+							getHtmlGenerator()
+								.resolveAssetUrlSentinels(
+									getHtmlGenerator().resolveHtmlPageUrlSentinels(
+										getHtmlGenerator().resolveChunkUrlSentinels(
+											raw,
+											compilation
+										),
+										computePageFilenameByEntry
+									),
+									compilation
+								)
+								.split(autoPlaceholder)
+								.join("")
 						)
-							.split(autoPlaceholder)
-							.join("")
-					).replace(
-						/__WEBPACK_HTML_INLINE__[0-9a-f]+__[a-z]+(?:__[0-9a-f]+)?__END__/g,
-						""
-					);
+						.replace(
+							/__WEBPACK_HTML_INLINE__[0-9a-f]+__[a-z]+(?:__[0-9a-f]+)?__END__/g,
+							""
+						);
 					if (resolved === raw) return source;
 					const chunkId = String(renderContext.chunk.id);
 					const prior = sentinelResolvedSourceCache.get(chunkId);
@@ -1099,13 +1243,7 @@ class HtmlModulesPlugin {
  * @returns {HtmlCompilationHooks} the hooks
  */
 HtmlModulesPlugin.getCompilationHooks = createHooksRegistry(
-	() =>
-		/** @type {HtmlCompilationHooks} */ ({
-			injectTags: new AsyncSeriesWaterfallHook(["tags", "context"]),
-			transformTags: new AsyncSeriesHook(["tags", "context"]),
-			transformHtml: new AsyncSeriesWaterfallHook(["html", "context"]),
-			htmlEmitted: new AsyncSeriesHook(["context"])
-		})
+	createCompilationHooks
 );
 
 module.exports = HtmlModulesPlugin;