webpack 4 upgrade

Author: RezaHaidari

Diff for: build/webpack.base.config.js

@@ -3,10 +3,11 @@ const webpack = require('webpack')
 const vueConfig = require('./vue-loader.config')
 const ExtractTextPlugin = require('extract-text-webpack-plugin')
 const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
+const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
 
 const isProd = process.env.NODE_ENV === 'production'
 
-module.exports = {
+const config = {
   devtool: isProd
     ? false
     : '#cheap-module-source-map',
@@ -56,17 +57,32 @@ module.exports = {
     maxEntrypointSize: 300000,
     hints: isProd ? 'warning' : false
   },
+  mode: process.env.NODE_ENV || 'production',
   plugins: isProd
     ? [
-        new webpack.optimize.UglifyJsPlugin({
-          compress: { warnings: false }
-        }),
         new webpack.optimize.ModuleConcatenationPlugin(),
         new ExtractTextPlugin({
-          filename: 'common.[chunkhash].css'
+          filename: 'common.[chunkhash].css',
+          allChunks: true
         })
       ]
     : [
         new FriendlyErrorsPlugin()
       ]
 }
+
+if(isProd) config.optimization = {
+    ...config.optimization,
+    minimizer: [
+    new UglifyJsPlugin({
+        sourceMap: true,
+        uglifyOptions: {
+            compress: {
+                inline: false,
+            },
+        },
+    }),
+],
+}
+
+module.exports = config

Diff for: build/webpack.client.config.js

@@ -19,26 +19,31 @@ const config = merge(base, {
       'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development'),
       'process.env.VUE_ENV': '"client"'
     }),
-    // extract vendor chunks for better caching
-    new webpack.optimize.CommonsChunkPlugin({
-      name: 'vendor',
-      minChunks: function (module) {
-        // a module is extracted into the vendor chunk if...
-        return (
-          // it's inside node_modules
-          /node_modules/.test(module.context) &&
-          // and not a CSS file (due to extract-text-webpack-plugin limitation)
-          !/\.css$/.test(module.request)
-        )
-      }
-    }),
-    // extract webpack runtime & manifest to avoid vendor chunk hash changing
-    // on every build.
-    new webpack.optimize.CommonsChunkPlugin({
-      name: 'manifest'
-    }),
+
     new VueSSRClientPlugin()
-  ]
+  ],
+  optimization:{
+        runtimeChunk: {
+            name: "manifest"
+        },
+      // extract webpack runtime & manifest to avoid vendor chunk hash changing
+      // on every build.
+      // extract vendor chunks for better caching
+        splitChunks:{
+            chunks:"initial",
+            cacheGroups: {
+                vendors: function (module) {
+                    // a module is extracted into the vendor chunk if...
+                    return (
+                        // it's inside node_modules
+                        /node_modules/.test(module.context) &&
+                        // and not a CSS file (due to extract-text-webpack-plugin limitation)
+                        !/\.css$/.test(module.request)
+                    )
+                }
+            }
+        }
+    },
 })
 
 if (process.env.NODE_ENV === 'production') {