Upgrade webpack version

package.json

@@ -28,17 +28,16 @@
     "@types/react": "^16.14.8",
     "@types/react-dom": "^16.9.13",
     "clean-webpack-plugin": "^3.0.0",
-    "html-webpack-plugin": "^3.2.0",
+    "html-webpack-plugin": "^5.3.2",
     "source-map-loader": "^0.2.4",
     "ts-loader": "^6.2.2",
     "typescript": "^3.9.10",
     "url-loader": "^2.3.0",
     "webpack": "^5.40.0",
-    "webpack-cli": "^3.3.11",
-    "webpack-dev-server": "^3.11.2"
+    "webpack-cli": "^4.7.2"
   },
   "scripts": {
-    "build": "webpack --production --progress --colors --verbose",
-    "start": "webpack-dev-server --colors --progress --hot"
+    "build": "webpack --mode=production --progress --color",
+    "start": "webpack serve --progress --hot"
   }
 }

webpack.config.js

@@ -1,9 +1,9 @@
-var Path = require('path')
-var HtmlWebpackPlugin = require('html-webpack-plugin')
-var CleanWebpackPlugin = require('clean-webpack-plugin').CleanWebpackPlugin
+const Path = require('path')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+const CleanWebpackPlugin = require('clean-webpack-plugin').CleanWebpackPlugin
 
 module.exports = {
-  mode: 'production',
+  mode: 'development',
   devtool: 'source-map',
   resolve: {
     extensions: ['.js', '.ts', '.tsx']
@@ -23,7 +23,10 @@ module.exports = {
       exclude: /node_modules/
     }, {
       test: /\.woff2$/,
-      loader: 'url-loader?limit=65535'
+      loader: 'url-loader',
+      options: {
+        limit: 65535
+      }
     }]
   },
   performance: {
@@ -33,6 +36,6 @@ module.exports = {
   plugins: [new CleanWebpackPlugin(), new HtmlWebpackPlugin({
     filename: 'index.html',
     template: 'src/index.html',
-    minify: {collapseWhitespace: true}
+    minify: { collapseWhitespace: true }
   })]
 }