fix(webpack): fix missing postcss in less/scss/styl processing

closes #1152
aurelia · Oct 31, 2019 · 7d74162 · 7d74162
1 parent 17afc51
commit 7d74162
Showing 1 changed file with 29 additions and 7 deletions.
diff --git a/skeleton/webpack/webpack.config.js b/skeleton/webpack/webpack.config.js
@@ -40,6 +40,17 @@ const cssRules = [
   // @endif
 ];
 
+// @if feat.less
+const lessRules = [
+  {
+     loader: "less-loader",
+     options: {
+       includePaths: ["node_modules"]
+     }
+  }
+];
+// @endif
+
 // @if feat.sass
 const sassRules = [
   {
@@ -51,6 +62,17 @@ const sassRules = [
 ];
 // @endif
 
+// @if feat.stylus
+const stylusRules = [
+  {
+     loader: "stylus-loader",
+     options: {
+       includePaths: ["node_modules"]
+     }
+  }
+];
+// @endif
+
 module.exports = ({ production } = {}, {extractCss, analyze, tests, hmr, port, host } = {}) => ({
   resolve: {
     // @if feat.typescript
@@ -238,13 +260,13 @@ module.exports = ({ production } = {}, {extractCss, analyze, tests, hmr, port, h
         test: /\.less$/i,
         use: extractCss ? [{
           loader: MiniCssExtractPlugin.loader
-        }, ...cssRules, 'less-loader'
-        ]: ['style-loader', ...cssRules, 'less-loader'],
+        }, ...cssRules, ...lessRules
+        ]: ['style-loader', ...cssRules, ...lessRules],
         issuer: /\.[tj]s$/i
       },
       {
         test: /\.less$/i,
-        use: ['css-loader', 'less-loader'],
+        use: [...cssRules, ...lessRules],
         issuer: /\.html?$/i
       },
       // @endif
@@ -253,13 +275,13 @@ module.exports = ({ production } = {}, {extractCss, analyze, tests, hmr, port, h
         test: /\.styl$/i,
         use: extractCss ? [{
           loader: MiniCssExtractPlugin.loader
-        }, ...cssRules, 'stylus-loader'
-        ]: ['style-loader', ...cssRules, 'stylus-loader'],
+        }, ...cssRules, ...stylusRules
+        ]: ['style-loader', ...cssRules, ...stylusRules],
         issuer: /\.[tj]s$/i
       },
       {
         test: /\.styl$/i,
-        use: ['css-loader', 'stylus-loader'],
+        use: [...cssRules, ...stylusRules],
         issuer: /\.html?$/i
       },
       // @endif
@@ -274,7 +296,7 @@ module.exports = ({ production } = {}, {extractCss, analyze, tests, hmr, port, h
       },
       {
         test: /\.scss$/,
-        use: ['css-loader', 'sass-loader'],
+        use: [...cssRules, ...sassRules],
         issuer: /\.html?$/i
       },
       // @endif