webpack5 less css module

467 阅读1分钟
			{
				test: /\.less$/i,
				exclude: [/node_modules/, /\.module\.less$/i],
				use: [
					MiniCssExtractPlugin.loader,
					{
						loader: 'css-loader',
						options: {
							esModule: true,
							modules: {
								namedExport: true,
								localIdentName: 'foo__[name]__[local]',
							},
						},
					},
					{
						loader: 'postcss-loader',
						options: {
							// 如果没有options这个选项将会报错 No PostCSS Config found
							postcssOptions: {
								ident: 'postcss',
								plugins: (loader) => [
									require('autoprefixer')(), //CSS浏览器兼容
								],
							},
						},
					},
					{
						loader: 'less-loader',
					},
				],
			},
			{
				test: /\.module\.less$/i,
				exclude: /node_modules/,
				use: [
					MiniCssExtractPlugin.loader,
					{
						loader: 'css-loader',
						options: {
							esModule: true,
							modules: {
								namedExport: true,
								localIdentName: 'foo__[name]_[local]_[hash:base64:8]',
							},
						},
					},
					{
						loader: 'postcss-loader',
						options: {
							// 如果没有options这个选项将会报错 No PostCSS Config found
							postcssOptions: {
								ident: 'postcss',
								plugins: (loader) => [
									require('autoprefixer')(), //CSS浏览器兼容
								],
							},
						},
					},
					{
						loader: 'less-loader',
					},
				],
			},