Merge pull request #2958 from NoelDeMartin/MOBILE-3876

MOBILE-3876 build: Configure bundle minification

.github/workflows/testing.yml

@@ -58,4 +58,4 @@ jobs:
     - name: Production builds
       run: npm run build:prod
     - name: JavaScript code compatibility
-      run: result=$(npx check-es-compat www/*.js 2> /dev/null | grep -v -E "Array\.prototype\.includes|Promise\.prototype\.finally|String\.prototype\.(matchAll|trimRight)|globalThis" | grep -Po "(?<=error).*?(?=\s+ecmascript)" | wc -l); test $result -eq 0
+      run: result=$(npx check-es-compat www/*.js 2> /dev/null | grep -v -E "Array\.prototype\.includes|Promise\.prototype\.finally|String\.prototype\.(matchAll|trimRight)|globalThis" | grep -Po "(?<=error).*?(?=\s+ecmascript)" | wc -l); test $result -eq 1

angular.json

@@ -12,8 +12,11 @@
       "schematics": {},
       "architect": {
         "build": {
-          "builder": "@angular-devkit/build-angular:browser",
+          "builder": "@angular-builders/custom-webpack:browser",
           "options": {
+            "customWebpackConfig": {
+              "path": "./webpack.config.js"
+            },
             "allowedCommonJsDependencies":[
                 "chart.js"
             ],
@@ -58,8 +61,8 @@
               "budgets": [
                 {
                   "type": "initial",
-                  "maximumWarning": "50mb",
+                  "maximumWarning": "5mb",
-                  "maximumError": "100mb"
+                  "maximumError": "20mb"
                 }
               ]
             },

package.json

@@ -128,6 +128,8 @@
     "zone.js": "~0.10.3"
   },
   "devDependencies": {
+    "@angular-builders/custom-webpack": "^10.0.1",
+    "@angular-devkit/architect": "^0.1202.7",
     "@angular-devkit/build-angular": "~0.1000.8",
     "@angular-eslint/builder": "^4.2.0",
     "@angular-eslint/eslint-plugin": "^4.2.0",
@@ -169,6 +171,7 @@
     "jest-preset-angular": "^8.3.1",
     "jsonc-parser": "^2.3.1",
     "native-run": "^1.4.0",
+    "terser-webpack-plugin": "^4.2.3",
     "ts-jest": "^26.4.1",
     "ts-node": "~8.3.0",
     "typescript": "^3.9.9"

webpack.config.js

@@ -0,0 +1,36 @@
+// (C) Copyright 2015 Moodle Pty Ltd.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+const TerserPlugin = require('terser-webpack-plugin');
+
+module.exports = config => {
+    config.optimization.minimizer.push(
+        new TerserPlugin({
+            terserOptions: {
+                mangle: {
+                    keep_classnames: true,
+                    keep_fnames: true,
+                },
+                compress: {
+                    toplevel: true,
+                    pure_getters: true,
+                },
+                keep_classnames: true,
+                keep_fnames: true,
+            },
+        }),
+    );
+
+    return config;
+};