Merge pull request #1 from Geta/feature/switch-to-terser

Use terser instead of uglify for JS optimization

Author: eirhor

docs/webpack.core.md

@@ -135,7 +135,7 @@ Allows you to override the default target of the config. Default target is ```we
 
 #### About
 
-Adds generic optimizations for production. Currently contains the ```uglifyjs-webpack-plugin``` and ```optimize-css-assets-webpack-plugin```.
+Adds generic optimizations for production. Currently contains the ```terser-webpack-plugin``` and ```optimize-css-assets-webpack-plugin```.
 
 ### .addSourceMapsForDevelopment()
 
@@ -184,4 +184,4 @@ Adds TypeScript and TSLint support to the project. If mode is production, linter
 
 Formats the config into a object and returns it. The object is formatted following the webpack best practices. Enables watchmode if mode is development.
 
-After the config is returned, it is possible to manually adjust the object in your config, if there are some use case which is not covered in this helper.
+After the config is returned, it is possible to manually adjust the object in your config, if there are some use case which is not covered in this helper.

package.json

@@ -72,10 +72,10 @@
     "stylelint-config-standard": "^19.0.0",
     "stylelint-scss": "^3.12.0",
     "stylelint-webpack-plugin": "^1.0.3",
+    "terser-webpack-plugin": "^2.2.1",
     "ts-loader": "^5.2.1",
     "tsconfig-paths-webpack-plugin": "^3.2.0",
     "typescript": "^3.6.4",
-    "uglifyjs-webpack-plugin": "^2.0.1",
     "url-loader": "^2.2.0",
     "webpack": "^4.41.2",
     "webpack-bundle-analyzer": "^3.6.0",

proto/with-optimizations.js

@@ -1,17 +1,17 @@
 const modes = require('../constants/modes');
-const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
 const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
+const TerserPlugin = require('terser-webpack-plugin');
 
 module.exports = function(context, mode) {
-    if (mode === modes.production) {
-        context._optimization['minimizer'] = [
-            new UglifyJsPlugin({
-                cache: true,
-                parallel: true,
-                sourceMap: false,
-            }),
-            new OptimizeCssAssetsPlugin({}),
-        ];
+    const isProduction = mode === modes.production;
+    const minimizerPlugins = [new TerserPlugin()];
+
+    if (isProduction) {
+        minimizerPlugins.push(new OptimizeCssAssetsPlugin({}))
     }
+
+    context._optimization['minimize'] = mode === modes.production;
+    context._optimization['minimizer'] = minimizerPlugins;
+
     return this;
 };