test/configCases/css/css-modules/webpack.config.js - main - githubmirror/webpack

test/configCases/css/css-modules/webpack.config.js
205 строк4 KB
Alexander Akait
test: align node-production uniqueName with web-production in css-modules (#20935)
08 май 2026, 20:39
08 май 2026, 20:391efc283
"use strict";

const path = require("path");
const webpack = require("../../../../");

/** @type {NonNullable<import("../../../../").Configuration["module"]>["rules"]} */
const baseRules = [
	{
		test: /\.my-css$/i,
		type: "css/auto"
	},
	{
		test: /\.invalid$/i,
		type: "css/auto"
	}
];

/** @type {import("../../../../").Configuration} */
const base = {
	experiments: {
		css: true
	},
	module: {
		rules: baseRules
	}
};

// target: ["web", "node"]
// output module

/** @type {(env: Env, options: TestOptions) => import("../../../../").Configuration[]} */
module.exports = (env, { testPath }) => [
	{
		...base,
		name: "web-development",
		target: "web",
		mode: "development",
		output: {
			uniqueName: "my-app"
		},
		node: {
			__dirname: false,
			__filename: false
		}
	},
	{
		...base,
		name: "web-production",
		target: "web",
		mode: "production",
		output: {
			uniqueName: "my-app"
		},
		node: {
			__dirname: false,
			__filename: false
		},
		plugins: [
			new webpack.ids.DeterministicModuleIdsPlugin({
				maxLength: 3,
				failOnConflict: true,
				fixedLength: true,
				test: (m) => m.type.startsWith("css")
			}),
			new webpack.experiments.ids.SyncModuleIdsPlugin({
				test: (m) => m.type.startsWith("css"),
				path: path.resolve(testPath, "module-ids.json"),
				mode: "create"
			})
		]
	},
	{
		...base,
		dependencies: ["web-development"],
		name: "node-development",
		target: "node",
		mode: "development",
		output: {
			uniqueName: "my-app"
		}
	},
	{
		...base,
		dependencies: ["web-production"],
		name: "node-production",
		target: "node",
		mode: "production",
		output: {
			uniqueName: "my-app"
		},
		plugins: [
			new webpack.ids.DeterministicModuleIdsPlugin({
				maxLength: 3,
				failOnConflict: true,
				fixedLength: true,
				test: (m) => m.type.startsWith("css")
			}),
			new webpack.experiments.ids.SyncModuleIdsPlugin({
				test: (m) => m.type.startsWith("css"),
				path: path.resolve(testPath, "module-ids.json"),
				mode: "read"
			})
		]
	},
	// CSS modules `css/global`
	{
		entry: "./index-global.js",
		name: "web-development-global",
		target: "web",
		mode: "development",
		experiments: {
			css: true
		},
		module: {
			rules: [
				{
					test: /\.css$/i,
					type: "css/global"
				},
				{
					test: /\.my-css$/i,
					type: "css/global"
				},
				{
					test: /\.invalid$/i,
					type: "css/global"
				}
			]
		},
		output: {
			uniqueName: "my-app"
		},
		node: {
			__dirname: false,
			__filename: false
		}
	},
	{
		entry: "./index-global.js",
		name: "web-production-global",
		target: "web",
		mode: "production",
		experiments: {
			css: true
		},
		module: {
			rules: [
				{
					test: /\.css$/i,
					type: "css/global"
				},
				{
					test: /\.my-css$/i,
					type: "css/global"
				},
				{
					test: /\.invalid$/i,
					type: "css/global"
				}
			]
		},
		output: {
			uniqueName: "my-app"
		},
		node: {
			__dirname: false,
			__filename: false
		}
	},
	// CSS modules options
	{
		...base,
		entry: "./index-options.js",
		name: "web-development",
		target: "web",
		mode: "development",
		output: {
			uniqueName: "my-app"
		},
		module: {
			rules: [
				...baseRules,
				{
					// Scope the disable to the entry only — @imported `.module.css`
					// files keep default parser options (so custom properties in
					// var-function.module.css are still hashed).
					test: /style\.module\.css$/,
					type: "css/auto",
					parser: {
						animation: false,
						customIdents: false,
						dashedIdents: false,
						container: false,
						function: false,
						grid: false
					}
				}
			]
		},
		node: {
			__dirname: false,
			__filename: false
		}
	}
];