76 lines
1.7 KiB
TypeScript
76 lines
1.7 KiB
TypeScript
import { RuleSetRule, RuleSetUseItem } from 'webpack';
|
|
import MiniCssExtractPlugin from 'mini-css-extract-plugin';
|
|
import getCSSModuleLocalIdent from 'react-dev-utils/getCSSModuleLocalIdent';
|
|
|
|
const cssRegex = /\.css$/;
|
|
const cssModuleRegex = /\.module\.css$/;
|
|
|
|
const sassRegex = /\.(scss|sass)$/;
|
|
const sassModuleRegex = /\.module\.(scss|sass)$/;
|
|
|
|
function buildStyleLoaders(cssLoaderOptions: Record<string, any>): RuleSetUseItem[] {
|
|
const loaders = [
|
|
{
|
|
loader: MiniCssExtractPlugin.loader,
|
|
},
|
|
{
|
|
loader: 'css-loader',
|
|
options: { ...cssLoaderOptions, sourceMap: false },
|
|
},
|
|
];
|
|
return loaders;
|
|
}
|
|
|
|
export const cssLoader: RuleSetRule = {
|
|
test: cssRegex,
|
|
exclude: cssModuleRegex,
|
|
sideEffects: true,
|
|
use: [
|
|
...buildStyleLoaders({
|
|
importLoaders: 1,
|
|
esModule: false,
|
|
}),
|
|
],
|
|
};
|
|
|
|
export const cssModuleLoader: RuleSetRule = {
|
|
test: cssModuleRegex,
|
|
use: [
|
|
...buildStyleLoaders({
|
|
importLoaders: 1,
|
|
modules: {
|
|
getLocalIdent: getCSSModuleLocalIdent,
|
|
},
|
|
}),
|
|
],
|
|
};
|
|
|
|
export const sassLoader: RuleSetRule = {
|
|
test: sassRegex,
|
|
exclude: sassModuleRegex,
|
|
sideEffects: true,
|
|
use: [
|
|
...buildStyleLoaders({
|
|
importLoaders: 2,
|
|
}),
|
|
{
|
|
loader: 'sass-loader',
|
|
},
|
|
],
|
|
};
|
|
|
|
export const sassModuleLoader: RuleSetRule = {
|
|
test: sassModuleRegex,
|
|
use: [
|
|
...buildStyleLoaders({
|
|
importLoaders: 2,
|
|
modules: {
|
|
getLocalIdent: getCSSModuleLocalIdent,
|
|
},
|
|
}),
|
|
{
|
|
loader: 'sass-loader',
|
|
},
|
|
],
|
|
};
|