feat: deprecate sass, convert to css (#1531)

build/webpack.base.conf.js

@@ -41,12 +41,14 @@ module.exports = {
         exclude: /node_modules/,
       },
       {
-        test: /\.s?css$/,
+        test: /\.css$/i,
         use: [
           extractOrInjectStyles,
-          'css-loader',
+          {
+            loader: 'css-loader',
+            options: { importLoaders: 1 },
+          },
           'postcss-loader',
-          'sass-loader',
         ],
       },
     ],

build/webpack.dev.conf.js

@@ -1,4 +1,4 @@
-const merge = require('webpack-merge')
+const { merge } = require('webpack-merge')
 const chokidar = require('chokidar')
 const HtmlWebpackPlugin = require('html-webpack-plugin')
 const baseWebpackConfig = require('./webpack.base.conf')
@@ -18,20 +18,19 @@ module.exports = merge(baseWebpackConfig, {
     noEmitOnErrors: true,
   },
   devServer: {
-    hot: true,
-    hotOnly: true,
+    hot: 'only',
     open: true,
-    inline: true,
-    stats: {
-      children: false,
-      modules: false,
-      chunks: false,
-    },
+    // inline: true,
+    // stats: {
+    //   children: false,
+    //   modules: false,
+    //   chunks: false,
+    // },
     port: 8080,
-    before(app, server) {
-      chokidar.watch(['./**/*.html']).on('all', function () {
-        server.sockWrite(server.sockets, 'content-changed')
-      })
-    },
+    // onBeforeSetupMiddleware(server) {
+    //   chokidar.watch(['./**/*.html']).on('all', function () {
+    //     server.sockWrite(server.sockets, 'content-changed')
+    //   })
+    // },
   },
 })

build/webpack.prod.conf.js

@@ -1,5 +1,5 @@
 const TerserPlugin = require('terser-webpack-plugin')
-const merge = require('webpack-merge')
+const { merge } = require('webpack-merge')
 const baseWebpackConfig = require('./webpack.base.conf')
 
 module.exports = merge(baseWebpackConfig, {
@@ -11,10 +11,7 @@ module.exports = merge(baseWebpackConfig, {
     globalObject: "typeof self !== 'undefined' ? self : this",
   },
   optimization: {
-    minimizer: [
-      new TerserPlugin({
-        sourceMap: true,
-      }),
-    ],
+    minimize: true,
+    minimizer: [new TerserPlugin()],
   },
 })