Error while genrating the UI. Perhaps related to https://stackoverflow.com/questions/42375468/uglify-syntaxerror-unexpected-token-punc

Makefile

@@ -41,6 +41,9 @@ docs-server: docs
 webui: venv-dev
 	cd glances/outputs/static/ && npm install && npm audit fix && npm run build
 
+webui-force: venv-dev
+	cd glances/outputs/static/ && npm install && npm audit fix --force && npm run build
+
 run: venv
 	./venv/bin/python -m glances -C ./conf/glances.conf
 

glances/outputs/static/package.json

@@ -9,8 +9,8 @@
   },
   "devDependencies": {
     "clean-webpack-plugin": "^0.1.19",
-    "copy-webpack-plugin": "^4.6.0",
-    "css-loader": "^0.28.11",
+    "copy-webpack-plugin": "^9.0.1",
+    "css-loader": "^6.5.1",
     "del": "^2.2.1",
     "exports-loader": "^0.7.0",
     "file-loader": "^1.1.11",
@@ -18,11 +18,12 @@
     "less": "^3.10.3",
     "less-loader": "^4.1.0",
     "ngtemplate-loader": "^2.0.1",
-    "node-sass": "^4.14.0",
+    "node-sass": "^6.0.1",
     "sass-loader": "^6.0.7",
     "style-loader": "^0.20.3",
     "url-loader": "^0.6.2",
-    "webpack": "^3.12.0"
+    "webpack": "^5.61.0",
+    "webpack-cli": "^4.9.1"
   },
   "scripts": {
     "build": "webpack --bail --progress --profile",

glances/outputs/static/webpack.config.js

@@ -12,9 +12,9 @@ module.exports = {
         filename: "glances.js",
         sourceMapFilename: "glances.map.js",
     },
-    devtool: "#source-map",
+    devtool: "source-map",
     module: {
-        loaders: [
+        rules: [
             {
                 test: /\.scss$/,
                 use: [{
@@ -37,29 +37,45 @@ module.exports = {
             },
             {
                 test: /\.css$/,
-                loader: "style-loader!css-loader",
+                // loader: "style-loader!css-loader",
+                use: [{
+                    loader: "style-loader",
+                }, {
+                    loader: "css-loader",
+                }]
             },
             {
                 test: /\.(png|jpg|gif|svg|ttf|woff|woff2|eot)$/,
-                loader: "url-loader",
-                options: {
-                    limit: 10000,
-                }
+                use: [{
+                    loader: "url-loader",
+                    options: {
+                        limit: 10000,
+                    }
+                }]
             },
             {
                 test: /\.html/,
-                loader: "ngtemplate-loader!html-loader"
+                // loader: "ngtemplate-loader!html-loader"
+                use: [{
+                    loader: "ngtemplate-loader",
+                }, {
+                    loader: "html-loader",
+                }]
             },
             {
                 test: require.resolve("angular"),
-                loader: "exports-loader?window.angular"
+                use: [{
+                    loader: "exports-loader?window.angular"
+                }]
             },
         ],
     },
     plugins: [
         new CleanWebpackPlugin("./public/*.*"),
-        new CopyWebpackPlugin([
-            { from: "./images/favicon.ico" }
-        ]),
+        new CopyWebpackPlugin({
+            patterns: [
+                { from: "./images/favicon.ico" },
+            ],
+        }),
     ]
 };