using my boilerplate yuh

webpack/loaders/styleLoaders.ts

@@ -0,0 +1,75 @@
+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',
+        },
+    ],
+};