Upgrade to webpack@5 (#4894)

package.json

@@ -16,9 +16,9 @@
     "dev-build": "concurrently yarn:compile:*",
     "debug-build": "concurrently yarn:compile:main yarn:compile:extension-types",
     "dev-run": "nodemon --watch static/build/main.js --exec \"electron --remote-debugging-port=9223 --inspect .\"",
-    "dev:main": "yarn run compile:main --watch",
-    "dev:renderer": "yarn run webpack-dev-server --config webpack.renderer.ts",
-    "dev:extension-types": "yarn run compile:extension-types --watch",
+    "dev:main": "yarn run compile:main --watch --progress",
+    "dev:renderer": "yarn run compile:renderer --watch --progress",
+    "dev:extension-types": "yarn run compile:extension-types --watch --progress",
     "compile": "env NODE_ENV=production concurrently yarn:compile:*",
     "compile:main": "yarn run webpack --config webpack.main.ts",
     "compile:renderer": "yarn run webpack --config webpack.renderer.ts",
@@ -62,7 +62,7 @@
     },
     "moduleNameMapper": {
       "\\.(css|scss)$": "<rootDir>/__mocks__/styleMock.ts",
-      "\\.(svg)$": "<rootDir>/__mocks__/imageMock.ts"
+      "\\.(svg|png|jpg|eot|woff2?|ttf)$": "<rootDir>/__mocks__/assetMock.ts"
     },
     "modulePathIgnorePatterns": [
       "<rootDir>/dist",
@@ -268,7 +268,7 @@
     "@material-ui/core": "^4.12.3",
     "@material-ui/icons": "^4.11.2",
     "@material-ui/lab": "^4.0.0-alpha.60",
-    "@pmmmwh/react-refresh-webpack-plugin": "^0.4.3",
+    "@pmmmwh/react-refresh-webpack-plugin": "^0.5.4",
     "@sentry/types": "^6.14.1",
     "@testing-library/jest-dom": "^5.16.1",
     "@testing-library/react": "^11.2.7",
@@ -291,12 +291,11 @@
     "@types/lodash": "^4.14.177",
     "@types/marked": "^4.0.1",
     "@types/md5-file": "^4.0.2",
-    "@types/mini-css-extract-plugin": "^0.9.1",
+    "@types/mini-css-extract-plugin": "^2.4.0",
     "@types/mock-fs": "^4.13.1",
     "@types/node": "14.17.33",
     "@types/node-fetch": "^2.5.12",
     "@types/npm": "^2.0.32",
-    "@types/progress-bar-webpack-plugin": "^2.1.2",
     "@types/proper-lockfile": "^4.1.2",
     "@types/randomcolor": "^0.5.6",
     "@types/react": "^17.0.34",
@@ -319,10 +318,10 @@
     "@types/triple-beam": "^1.3.2",
     "@types/url-parse": "^1.4.5",
     "@types/uuid": "^8.3.3",
-    "@types/webpack": "^4.41.32",
-    "@types/webpack-dev-server": "^3.11.6",
+    "@types/webpack": "^5.28.0",
+    "@types/webpack-dev-server": "^4.7.2",
     "@types/webpack-env": "^1.16.3",
-    "@types/webpack-node-externals": "^1.7.1",
+    "@types/webpack-node-externals": "^2.5.3",
     "@typescript-eslint/eslint-plugin": "^5.10.1",
     "@typescript-eslint/parser": "^5.10.1",
     "ansi_up": "^5.1.0",
@@ -330,25 +329,24 @@
     "circular-dependency-plugin": "^5.2.2",
     "color": "^3.2.1",
     "concurrently": "^5.3.0",
-    "css-loader": "^5.2.7",
+    "css-loader": "^6.5.1",
     "deepdash": "^5.3.9",
     "dompurify": "^2.3.4",
     "electron": "^14.2.4",
     "electron-builder": "^22.14.5",
     "electron-notarize": "^0.3.0",
     "esbuild": "^0.13.15",
-    "esbuild-loader": "^2.16.0",
+    "esbuild-loader": "^2.18.0",
     "eslint": "^8.7.0",
     "eslint-plugin-header": "^3.1.1",
     "eslint-plugin-import": "^2.25.4",
     "eslint-plugin-react": "^7.28.0",
     "eslint-plugin-react-hooks": "^4.3.0",
     "eslint-plugin-unused-imports": "^2.0.0",
-    "file-loader": "^6.2.0",
     "flex.box": "^3.4.4",
-    "fork-ts-checker-webpack-plugin": "^5.2.1",
+    "fork-ts-checker-webpack-plugin": "^6.5.0",
     "hoist-non-react-statics": "^3.3.2",
-    "html-webpack-plugin": "^4.5.2",
+    "html-webpack-plugin": "^5.5.0",
     "ignore-loader": "^0.1.2",
     "include-media": "^1.4.9",
     "jest": "26.6.3",
@@ -356,43 +354,41 @@
     "jest-fetch-mock": "^3.0.3",
     "jest-mock-extended": "^1.0.18",
     "make-plural": "^6.2.2",
-    "mini-css-extract-plugin": "^1.6.2",
+    "mini-css-extract-plugin": "^2.5.2",
     "node-gyp": "7.1.2",
-    "node-loader": "^1.0.3",
+    "node-loader": "^2.0.0",
     "nodemon": "^2.0.15",
     "playwright": "^1.17.1",
     "postcss": "^8.4.5",
-    "postcss-loader": "^4.3.0",
-    "progress-bar-webpack-plugin": "^2.1.0",
+    "postcss-loader": "^6.2.1",
     "randomcolor": "^0.6.2",
-    "raw-loader": "^4.0.2",
     "react-beautiful-dnd": "^13.1.0",
-    "react-refresh": "^0.9.0",
+    "react-refresh": "^0.11.0",
+    "react-refresh-typescript": "^2.0.3",
     "react-router-dom": "^5.3.0",
     "react-select": "3.2.0",
     "react-select-event": "^5.1.0",
     "react-table": "^7.7.0",
     "react-window": "^1.8.6",
     "sass": "^1.45.1",
-    "sass-loader": "^10.2.0",
+    "sass-loader": "^12.4.0",
     "sharp": "^0.29.3",
-    "style-loader": "^2.0.0",
+    "style-loader": "^3.3.1",
     "tailwindcss": "^3.0.7",
     "ts-jest": "26.5.6",
-    "ts-loader": "^7.0.5",
+    "ts-loader": "^9.2.6",
     "ts-node": "^10.4.0",
     "type-fest": "^1.0.2",
     "typed-emitter": "^1.4.0",
     "typedoc": "0.22.10",
-    "typedoc-plugin-markdown": "^3.11.3",
+    "typedoc-plugin-markdown": "^3.11.12",
     "typeface-roboto": "^1.1.13",
     "typescript": "^4.5.2",
     "typescript-plugin-css-modules": "^3.4.0",
-    "url-loader": "^4.1.1",
-    "webpack": "^4.46.0",
-    "webpack-cli": "^3.3.12",
-    "webpack-dev-server": "^3.11.3",
-    "webpack-node-externals": "^1.7.2",
+    "webpack": "^5.69.0",
+    "webpack-cli": "^4.9.2",
+    "webpack-dev-server": "^4.7.4",
+    "webpack-node-externals": "^3.0.0",
     "xterm": "^4.15.0",
     "xterm-addon-fit": "^0.5.0"
   }