webpack 5.106.2 → 5.107.0

package/lib/dependencies/CssIcssExportDependency.js

@@ -7,13 +7,14 @@
 
 const { CSS_TYPE, JAVASCRIPT_TYPE } = require("../ModuleSourceTypeConstants");
 const { interpolate } = require("../TemplatedPathPlugin");
-const WebpackError = require("../WebpackError");
+const WebpackError = require("../errors/WebpackError");
 const { cssExportConvention } = require("../util/conventions");
 const createHash = require("../util/createHash");
 const { makePathsRelative } = require("../util/identifier");
 const makeSerializable = require("../util/makeSerializable");
 const memoize = require("../util/memoize");
 const nonNumericOnlyHash = require("../util/nonNumericOnlyHash");
+const { updateHashFromSource } = require("../util/source");
 const CssIcssImportDependency = require("./CssIcssImportDependency");
 const NullDependency = require("./NullDependency");
 
@@ -23,7 +24,8 @@ const getCssParser = memoize(() => require("../css/CssParser"));
 /** @typedef {import("../../declarations/WebpackOptions").HashFunction} HashFunction */
 /** @typedef {import("../../declarations/WebpackOptions").CssGeneratorExportsConvention} CssGeneratorExportsConvention */
 /** @typedef {import("../../declarations/WebpackOptions").CssGeneratorLocalIdentName} CssGeneratorLocalIdentName */
-/** @typedef {import("../CssModule")} CssModule */
+/** @typedef {import("../css/CssModule")} CssModule */
+/** @typedef {import("../Module").BuildInfo} BuildInfo */
 /** @typedef {import("../Dependency")} Dependency */
 /** @typedef {import("../Dependency").ReferencedExports} ReferencedExports */
 /** @typedef {import("../Dependency").ExportsSpec} ExportsSpec */
@@ -36,10 +38,11 @@ const getCssParser = memoize(() => require("../css/CssParser"));
 /** @typedef {import("../util/Hash")} Hash */
 /** @typedef {import("../util/runtime").RuntimeSpec} RuntimeSpec */
 /** @typedef {import("../ChunkGraph")} ChunkGraph */
+/** @typedef {import("../Compilation").ModulePathData} ModulePathData */
 /** @typedef {import("../RuntimeTemplate")} RuntimeTemplate */
 /** @typedef {import("../css/CssParser").Range} Range */
 
-/** @typedef {(name: string) => string} ExportsConventionFn */
+/** @typedef {(name: string) => string | string[]} ExportsConventionFn */
 
 /**
  * Returns local ident.
@@ -104,7 +107,7 @@ const getLocalIdent = (local, module, chunkGraph, runtimeTemplate) => {
 		const source = module.originalSource();
 
 		if (source) {
-			hash.update(source.buffer());
+			updateHashFromSource(hash, source);
 		}
 
 		if (module.error) {
@@ -157,13 +160,113 @@ const getLocalIdent = (local, module, chunkGraph, runtimeTemplate) => {
 	return localIdent.replace(/^((-?\d)|--)/, "_$1");
 };
 
-/** @typedef {string | [string, string]} Value */
+/** @typedef {string | [string, string] | [string, string, string]} Value */
 
 // 0 - replace, 1 - replace, 2 - append,  2 - once
 /** @typedef {0 | 1 | 2 | 3 | 4} ExportMode */
 // 0 - normal, 1 - custom css variable, 2 - grid custom ident, 3 - composes
 /** @typedef {0 | 1 | 2 | 3} ExportType */
 
+/**
+ * Computes the interpolated identifier for `(module, value, exportType)`.
+ * Module-level reference so `moduleGraph.cached` can use it as a stable
+ * computer key — repeated lookups during a build skip
+ * `cssExportConvention`, `getLocalIdent` (with its content / path hashing)
+ * and `escapeIdentifier`.
+ * @param {ModuleGraph} _moduleGraph module graph (unused, kept for `cached` signature)
+ * @param {CssModule} module css module the value resolves in
+ * @param {string} value raw value to interpolate
+ * @param {ExportType} exportType export type discriminator
+ * @param {ChunkGraph} chunkGraph chunk graph
+ * @param {RuntimeTemplate} runtimeTemplate runtime template
+ * @returns {string} interpolated identifier
+ */
+const computeInterpolatedIdentifier = (
+	_moduleGraph,
+	module,
+	value,
+	exportType,
+	chunkGraph,
+	runtimeTemplate
+) => {
+	const generator = /** @type {CssGenerator} */ (module.generator);
+	const local = cssExportConvention(
+		value,
+		/** @type {CssGeneratorExportsConvention} */
+		(generator.options.exportsConvention)
+	)[0];
+	const prefix =
+		exportType === CssIcssExportDependency.EXPORT_TYPE.CUSTOM_VARIABLE
+			? "--"
+			: "";
+	return (
+		prefix +
+		getCssParser().escapeIdentifier(
+			getLocalIdent(local, module, chunkGraph, runtimeTemplate),
+			runtimeTemplate.compilation.compiler.root
+		)
+	);
+};
+
+/**
+ * Top-level computer for `resolve`. Allocates a fresh `seen` set; recursive
+ * calls go through the un-cached inner path so cycle detection still works.
+ * @param {ModuleGraph} moduleGraph module graph
+ * @param {CssModule} module module to search
+ * @param {string} localName local name
+ * @param {string} importName imported export name
+ * @param {string | undefined} request request of the active `@value` import
+ * @param {ChunkGraph} chunkGraph chunk graph
+ * @param {RuntimeTemplate} runtimeTemplate runtime template
+ * @returns {string | undefined} resolved value or undefined
+ */
+const computeResolve = (
+	moduleGraph,
+	module,
+	localName,
+	importName,
+	request,
+	chunkGraph,
+	runtimeTemplate
+) =>
+	CssIcssExportDependency.Template._doResolve(
+		localName,
+		importName,
+		/** @type {DependencyTemplateContext} */
+		(
+			/** @type {unknown} */
+			({ moduleGraph, module, chunkGraph, runtimeTemplate })
+		),
+		request,
+		new Set()
+	);
+
+/**
+ * Top-level computer for `resolveReferences`. See `computeResolve`.
+ * @param {ModuleGraph} moduleGraph module graph
+ * @param {CssIcssExportDependency} dep export dependency
+ * @param {CssModule} module module that hosts `dep`
+ * @param {ChunkGraph} chunkGraph chunk graph
+ * @param {RuntimeTemplate} runtimeTemplate runtime template
+ * @returns {string[]} final references, deduplicated
+ */
+const computeResolveReferences = (
+	moduleGraph,
+	dep,
+	module,
+	chunkGraph,
+	runtimeTemplate
+) =>
+	CssIcssExportDependency.Template._doResolveReferences(
+		dep,
+		/** @type {DependencyTemplateContext} */
+		(
+			/** @type {unknown} */
+			({ moduleGraph, module, chunkGraph, runtimeTemplate })
+		),
+		new Set()
+	);
+
 class CssIcssExportDependency extends NullDependency {
 	/**
 	 * Example of dependency:
@@ -193,6 +296,10 @@ class CssIcssExportDependency extends NullDependency {
 		this.exportType = exportType;
 		/** @type {undefined | string} */
 		this._hashUpdate = undefined;
+		/** @type {undefined | string[]} */
+		this._conventionNames = undefined;
+		/** @type {undefined | string[]} */
+		this._valueConventionNames = undefined;
 	}
 
 	get type() {
@@ -213,6 +320,26 @@ class CssIcssExportDependency extends NullDependency {
 		return this._conventionNames;
 	}
 
+	/**
+	 * Memoized `cssExportConvention(this.value, convention)`. Used by every
+	 * code path that needs the convention-derived aliases of the composed /
+	 * referenced class: `getReferencedExports`, `getWarnings`, and the template's
+	 * `getIdentifier`. Caller guarantees `typeof this.value === "string"` —
+	 * the array form (cross-module references) is resolved separately.
+	 * @param {CssGeneratorExportsConvention} convention convention of the export name
+	 * @returns {string[]} convention results
+	 */
+	getValueConventionNames(convention) {
+		if (this._valueConventionNames) {
+			return this._valueConventionNames;
+		}
+		this._valueConventionNames = cssExportConvention(
+			/** @type {string} */ (this.value),
+			convention
+		);
+		return this._valueConventionNames;
+	}
+
 	/**
 	 * Returns list of exports referenced by this dependency
 	 * @param {ModuleGraph} moduleGraph module graph
@@ -221,14 +348,26 @@ class CssIcssExportDependency extends NullDependency {
 	 */
 	getReferencedExports(moduleGraph, runtime) {
 		if (
-			this.exportMode === CssIcssExportDependency.EXPORT_MODE.SELF_REFERENCE
+			this.exportMode === CssIcssExportDependency.EXPORT_MODE.SELF_REFERENCE &&
+			typeof this.value === "string"
 		) {
-			return [
-				{
-					name: [this.name],
-					canMangle: true
-				}
-			];
+			// `composes: foo;` — the composed class (`this.value`) is the one
+			// referenced, not the class doing the composing (`this.name`). Apply
+			// the generator's `exportsConvention` so the export names produced
+			// by the convention are what the optimizer sees.
+			const module =
+				/** @type {CssModule | undefined} */
+				(moduleGraph.getParentModule(this));
+			if (!module) return super.getReferencedExports(moduleGraph, runtime);
+			const generator = /** @type {CssGenerator} */ (module.generator);
+			const names = this.getValueConventionNames(
+				/** @type {CssGeneratorExportsConvention} */
+				(generator.options.exportsConvention)
+			);
+			return names.map((name) => ({
+				name: [name],
+				canMangle: true
+			}));
 		}
 
 		return super.getReferencedExports(moduleGraph, runtime);
@@ -272,14 +411,30 @@ class CssIcssExportDependency extends NullDependency {
 	getWarnings(moduleGraph) {
 		if (
 			this.exportMode === CssIcssExportDependency.EXPORT_MODE.SELF_REFERENCE &&
-			!Array.isArray(this.value)
+			typeof this.value === "string"
 		) {
-			const module = moduleGraph.getParentModule(this);
+			const module =
+				/** @type {CssModule | undefined} */
+				(moduleGraph.getParentModule(this));
+
+			if (!module) return null;
+
+			// `ExportsInfo` only stores names produced by `exportsConvention`,
+			// so a raw `isExportProvided(this.value)` check is a false-positive
+			// for `camel-case-only` / `dashes-only` (and any custom function
+			// that drops the original spelling). Treat the composed class as
+			// provided if *any* of its convention-produced aliases is provided.
+			const generator = /** @type {CssGenerator} */ (module.generator);
+			const exportsInfo = moduleGraph.getExportsInfo(module);
+			const names = this.getValueConventionNames(
+				/** @type {CssGeneratorExportsConvention} */
+				(generator.options.exportsConvention)
+			);
+			const isProvided = names.some((name) =>
+				exportsInfo.isExportProvided(name)
+			);
 
-			if (
-				module &&
-				!moduleGraph.getExportsInfo(module).isExportProvided(this.value)
-			) {
+			if (!isProvided) {
 				const error = new WebpackError(
 					`Self-referencing name "${this.value}" not found`
 				);
@@ -309,7 +464,11 @@ class CssIcssExportDependency extends NullDependency {
 				/** @type {CssGeneratorExportsConvention} */
 				(generator.options.exportsConvention)
 			);
-			this._hashUpdate = `exportsConvention|${JSON.stringify(names)}|localIdentName|${JSON.stringify(generator.options.localIdentName)}`;
+			// Include all instance state that affects the emitted output —
+			// `name`, `value`, `range`, `interpolate`, `exportMode`,
+			// `exportType` — so changes like switching `composes: foo` →
+			// `composes: bar` or `ONCE` → `APPEND` invalidate caches.
+			this._hashUpdate = `exportsConvention|${JSON.stringify(names)}|localIdentName|${JSON.stringify(generator.options.localIdentName)}|value|${JSON.stringify(this.value)}|range|${JSON.stringify(this.range)}|interpolate|${this.interpolate}|exportMode|${this.exportMode}|exportType|${this.exportType}`;
 		}
 		hash.update(this._hashUpdate);
 	}
@@ -348,23 +507,60 @@ class CssIcssExportDependency extends NullDependency {
 CssIcssExportDependency.Template = class CssIcssExportDependencyTemplate extends (
 	NullDependency.Template
 ) {
-	// TODO looking how to cache
 	/**
-	 * Returns found reference.
+	 * Returns found reference. The top-level call (no `seen` argument) is
+	 * memoized via `moduleGraph.cached` keyed by `(module, localName,
+	 * importName, request, chunkGraph, runtimeTemplate)`. Recursive callers
+	 * pass `seen` and skip the cache so the cycle guard is preserved — only
+	 * completed top-level resolutions land in the cache.
 	 * @param {string} localName local name
 	 * @param {string} importName import name
 	 * @param {DependencyTemplateContext} templateContext the context object
+	 * @param {string | undefined} request user request of the `@value` import that was active when the reference was parsed — used to disambiguate when the same local name is imported from multiple modules
+	 * @param {Set<CssIcssExportDependency>=} seen seen to prevent cyclical problems
+	 * @returns {string | undefined} found reference
+	 */
+	static resolve(localName, importName, templateContext, request, seen) {
+		if (seen !== undefined) {
+			return CssIcssExportDependencyTemplate._doResolve(
+				localName,
+				importName,
+				templateContext,
+				request,
+				seen
+			);
+		}
+		const { moduleGraph, module, chunkGraph, runtimeTemplate } =
+			templateContext;
+		return moduleGraph.cached(
+			computeResolve,
+			/** @type {CssModule} */ (module),
+			localName,
+			importName,
+			request,
+			chunkGraph,
+			runtimeTemplate
+		);
+	}
+
+	/**
+	 * Inner recursive worker for `resolve`. Not memoized — see `resolve`.
+	 * @param {string} localName local name
+	 * @param {string} importName import name
+	 * @param {DependencyTemplateContext} templateContext the context object
+	 * @param {string | undefined} request user request
 	 * @param {Set<CssIcssExportDependency>} seen seen to prevent cyclical problems
 	 * @returns {string | undefined} found reference
 	 */
-	static resolve(localName, importName, templateContext, seen = new Set()) {
+	static _doResolve(localName, importName, templateContext, request, seen) {
 		const { moduleGraph } = templateContext;
 		const importDep =
 			/** @type {CssIcssImportDependency | undefined} */
 			(
-				templateContext.module.dependencies.find(
-					(d) =>
-						d instanceof CssIcssImportDependency && d.localName === localName
+				CssIcssExportDependencyTemplate.findImportDep(
+					templateContext.module.dependencies,
+					localName,
+					request
 				)
 			);
 		if (!importDep) return undefined;
@@ -388,13 +584,14 @@ CssIcssExportDependency.Template = class CssIcssExportDependencyTemplate extends
 		const { value, interpolate } = exportDep;
 
 		if (Array.isArray(value)) {
-			return this.resolve(
+			return CssIcssExportDependencyTemplate._doResolve(
 				value[0],
 				value[1],
 				{
 					...templateContext,
 					module
 				},
+				value[2],
 				seen
 			);
 		}
@@ -410,13 +607,65 @@ CssIcssExportDependency.Template = class CssIcssExportDependencyTemplate extends
 	}
 
 	/**
-	 * Resolves references.
+	 * Finds the active `CssIcssImportDependency` for a given local name. When a
+	 * `request` is provided the lookup also requires the import dependency's
+	 * `request` to match — this lets references that appear between two
+	 * `@value foo from "..."` declarations resolve through the import that was
+	 * in scope at the reference site, rather than always picking the first.
+	 * @param {Iterable<Dependency>} dependencies module dependencies to search
+	 * @param {string} localName local name
+	 * @param {string=} request user request of the `@value` import to match
+	 * @returns {CssIcssImportDependency | undefined} matching import dep, if any
+	 */
+	static findImportDep(dependencies, localName, request) {
+		/** @type {CssIcssImportDependency | undefined} */
+		let firstMatch;
+		for (const d of dependencies) {
+			if (d instanceof CssIcssImportDependency && d.localName === localName) {
+				if (request === undefined) return d;
+				if (d.request === request) return d;
+				if (firstMatch === undefined) firstMatch = d;
+			}
+		}
+		return firstMatch;
+	}
+
+	/**
+	 * Resolves references. The top-level call (no `seen` argument) is
+	 * memoized via `moduleGraph.cached`; recursive callers pass `seen` and
+	 * bypass the cache to keep the cycle guard intact.
+	 * @param {CssIcssExportDependency} dep value
+	 * @param {DependencyTemplateContext} templateContext template context
+	 * @param {Set<CssIcssExportDependency>=} seen to prevent cyclical problems
+	 * @returns {string[]} final names
+	 */
+	static resolveReferences(dep, templateContext, seen) {
+		if (seen !== undefined) {
+			return CssIcssExportDependencyTemplate._doResolveReferences(
+				dep,
+				templateContext,
+				seen
+			);
+		}
+		const { moduleGraph, module, chunkGraph, runtimeTemplate } =
+			templateContext;
+		return moduleGraph.cached(
+			computeResolveReferences,
+			dep,
+			/** @type {CssModule} */ (module),
+			chunkGraph,
+			runtimeTemplate
+		);
+	}
+
+	/**
+	 * Inner recursive worker for `resolveReferences`. Not memoized.
 	 * @param {CssIcssExportDependency} dep value
 	 * @param {DependencyTemplateContext} templateContext template context
 	 * @param {Set<CssIcssExportDependency>} seen to prevent cyclical problems
 	 * @returns {string[]} final names
 	 */
-	static resolveReferences(dep, templateContext, seen = new Set()) {
+	static _doResolveReferences(dep, templateContext, seen) {
 		/** @type {string[]} */
 		const references = [];
 
@@ -427,10 +676,10 @@ CssIcssExportDependency.Template = class CssIcssExportDependencyTemplate extends
 			const importDep =
 				/** @type {CssIcssImportDependency | undefined} */
 				(
-					templateContext.module.dependencies.find(
-						(d) =>
-							d instanceof CssIcssImportDependency &&
-							d.localName === dep.value[0]
+					CssIcssExportDependencyTemplate.findImportDep(
+						templateContext.module.dependencies,
+						dep.value[0],
+						dep.value[2]
 					)
 				);
 			if (!importDep) return references;
@@ -444,7 +693,7 @@ CssIcssExportDependency.Template = class CssIcssExportDependencyTemplate extends
 				if (d instanceof CssIcssExportDependency && d.name === dep.value[1]) {
 					if (Array.isArray(d.value)) {
 						const deepReferences =
-							CssIcssExportDependencyTemplate.resolveReferences(
+							CssIcssExportDependencyTemplate._doResolveReferences(
 								d,
 								{
 									...templateContext,
@@ -482,7 +731,7 @@ CssIcssExportDependency.Template = class CssIcssExportDependencyTemplate extends
 				) {
 					if (Array.isArray(d.value)) {
 						const deepReferences =
-							CssIcssExportDependencyTemplate.resolveReferences(
+							CssIcssExportDependencyTemplate._doResolveReferences(
 								d,
 								templateContext,
 								seen
@@ -506,7 +755,11 @@ CssIcssExportDependency.Template = class CssIcssExportDependencyTemplate extends
 	}
 
 	/**
-	 * Returns identifier.
+	 * Returns identifier. When the dep opts into interpolation the full
+	 * computation is memoized via `moduleGraph.cached` keyed by
+	 * `(module, value, exportType, chunkGraph, runtimeTemplate)` so
+	 * `cssExportConvention` / `getLocalIdent` / `escapeIdentifier` are not
+	 * re-run for the same identifier during code generation.
 	 * @param {string} value value to identifier
 	 * @param {Dependency} dependency the dependency for which the template should be applied
 	 * @param {DependencyTemplateContext} templateContext the context object
@@ -514,36 +767,17 @@ CssIcssExportDependency.Template = class CssIcssExportDependencyTemplate extends
 	 */
 	static getIdentifier(value, dependency, templateContext) {
 		const dep = /** @type {CssIcssExportDependency} */ (dependency);
-
-		if (dep.interpolate) {
-			const { module: m } = templateContext;
-			const module = /** @type {CssModule} */ (m);
-			const generator = /** @type {CssGenerator} */ (module.generator);
-			const local = cssExportConvention(
-				value,
-				/** @type {CssGeneratorExportsConvention} */
-				(generator.options.exportsConvention)
-			)[0];
-			const prefix =
-				dep.exportType === CssIcssExportDependency.EXPORT_TYPE.CUSTOM_VARIABLE
-					? "--"
-					: "";
-
-			return (
-				prefix +
-				getCssParser().escapeIdentifier(
-					getLocalIdent(
-						local,
-						/** @type {CssModule} */
-						(m),
-						templateContext.chunkGraph,
-						templateContext.runtimeTemplate
-					)
-				)
-			);
-		}
-
-		return value;
+		if (!dep.interpolate) return value;
+		const { moduleGraph, module, chunkGraph, runtimeTemplate } =
+			templateContext;
+		return moduleGraph.cached(
+			computeInterpolatedIdentifier,
+			/** @type {CssModule} */ (module),
+			value,
+			dep.exportType,
+			chunkGraph,
+			runtimeTemplate
+		);
 	}
 
 	/**
@@ -577,7 +811,8 @@ CssIcssExportDependency.Template = class CssIcssExportDependencyTemplate extends
 			const resolved = CssIcssExportDependencyTemplate.resolve(
 				dep.value[0],
 				dep.value[1],
-				templateContext
+				templateContext,
+				dep.value[2]
 			);
 
 			// Fallback to the local name if not resolved
@@ -616,12 +851,29 @@ CssIcssExportDependency.Template = class CssIcssExportDependencyTemplate extends
 						.filter(Boolean)
 				);
 			const allNames = new Set([...usedNames, ...names]);
-			const unescaped = getCssParser().unescapeIdentifier(value);
+			const unescaped = getCssParser().unescapeIdentifier(
+				value,
+				templateContext.runtimeTemplate.compilation.compiler.root
+			);
 
+			const depLocStart =
+				dep.loc &&
+				/** @type {{ start?: { line: number, column: number } }} */ (dep.loc)
+					.start;
 			for (const used of allNames) {
 				if (dep.exportMode === CssIcssExportDependency.EXPORT_MODE.ONCE) {
 					if (cssData.exports.has(used)) return;
 					cssData.exports.set(used, unescaped);
+					if (
+						depLocStart &&
+						cssData.exportLocs &&
+						!cssData.exportLocs.has(used)
+					) {
+						cssData.exportLocs.set(used, {
+							line: depLocStart.line,
+							column: depLocStart.column
+						});
+					}
 				} else {
 					const originalValue =
 						dep.exportMode === CssIcssExportDependency.EXPORT_MODE.REPLACE
@@ -632,6 +884,19 @@ CssIcssExportDependency.Template = class CssIcssExportDependencyTemplate extends
 						used,
 						`${originalValue ? `${originalValue}${unescaped ? " " : ""}` : ""}${unescaped}`
 					);
+					// Record the source location once per export (use the first
+					// occurrence — for APPEND/REPLACE this corresponds to the
+					// first selector seen, which is a reasonable anchor).
+					if (
+						depLocStart &&
+						cssData.exportLocs &&
+						!cssData.exportLocs.has(used)
+					) {
+						cssData.exportLocs.set(used, {
+							line: depLocStart.line,
+							column: depLocStart.column
+						});
+					}
 				}
 			}
 		} else if (

package/lib/dependencies/CssIcssImportDependency.js

@@ -5,7 +5,8 @@
 
 "use strict";
 
-const WebpackError = require("../WebpackError");
+const WebpackError = require("../errors/WebpackError");
+const { cssExportConvention } = require("../util/conventions");
 const makeSerializable = require("../util/makeSerializable");
 const CssImportDependency = require("./CssImportDependency");
 
@@ -13,7 +14,8 @@ const CssImportDependency = require("./CssImportDependency");
 /** @typedef {import("../Dependency")} Dependency */
 /** @typedef {import("../DependencyTemplate").CssDependencyTemplateContext} DependencyTemplateContext */
 /** @typedef {import("../Module")} Module */
-/** @typedef {import("../CssModule")} CssModule */
+/** @typedef {import("../css/CssGenerator")} CssGenerator */
+/** @typedef {import("../css/CssModule")} CssModule */
 /** @typedef {import("../ModuleGraph")} ModuleGraph */
 /** @typedef {import("../util/runtime").RuntimeSpec} RuntimeSpec */
 /** @typedef {import("../javascript/JavascriptParser").Range} Range */
@@ -39,6 +41,26 @@ class CssIcssImportDependency extends CssImportDependency {
 		super(request, range, mode);
 		this.importName = importName;
 		this.localName = localName;
+		/** @type {undefined | string[]} */
+		this._importNameConventionNames = undefined;
+	}
+
+	/**
+	 * Memoized `cssExportConvention(this.importName, convention)`. The target
+	 * module is fixed for a given dep, so its `exportsConvention` is fixed,
+	 * so the convention-derived aliases of `importName` can be cached on the dep.
+	 * @param {CssGeneratorExportsConvention} convention convention from the target module's generator
+	 * @returns {string[]} convention results
+	 */
+	getImportNameConventionNames(convention) {
+		if (this._importNameConventionNames) {
+			return this._importNameConventionNames;
+		}
+		this._importNameConventionNames = cssExportConvention(
+			this.importName,
+			convention
+		);
+		return this._importNameConventionNames;
 	}
 
 	get type() {
@@ -66,12 +88,32 @@ class CssIcssImportDependency extends CssImportDependency {
 	 * @returns {WebpackError[] | null | undefined} warnings
 	 */
 	getWarnings(moduleGraph) {
-		const module = moduleGraph.getModule(this);
+		const module = /** @type {CssModule | undefined} */ (
+			moduleGraph.getModule(this)
+		);
+
+		if (!module) return null;
+
+		// The target module stores exports under the names produced by its
+		// `exportsConvention`, so a raw `isExportProvided(this.importName)`
+		// would false-positive against `camel-case-only` / `dashes-only` (and
+		// any custom function that drops the original spelling). Expand
+		// `importName` through the *target* module's convention and accept
+		// if any alias is provided.
+		const generator =
+			/** @type {CssGenerator | undefined} */
+			(module.generator);
+		const convention =
+			generator &&
+			/** @type {CssGeneratorExportsConvention | undefined} */
+			(generator.options && generator.options.exportsConvention);
+		const exportsInfo = moduleGraph.getExportsInfo(module);
+		const names = convention
+			? this.getImportNameConventionNames(convention)
+			: [this.importName];
+		const isProvided = names.some((name) => exportsInfo.isExportProvided(name));
 
-		if (
-			module &&
-			!moduleGraph.getExportsInfo(module).isExportProvided(this.importName)
-		) {
+		if (!isProvided) {
 			const error = new WebpackError(
 				`Referenced name "${this.importName}" in "${this.userRequest}" not found`
 			);