Upgrade weboack-cli to 4.2, webpack-dev-server to 4.0.0-beta0, remove 'sockjs' redirect as wds4 uses ws instead

Signed-off-by: Hung-Han (Henry) Chen <1474479+chenhunghan@users.noreply.github.com>

package.json

@@ -279,7 +279,6 @@
     "@types/universal-analytics": "^0.4.4",
     "@types/uuid": "^8.0.0",
     "@types/webdriverio": "^4.13.0",
-    "@types/webpack-dev-server": "^3.11.1",
     "@types/webpack-env": "^1.15.2",
     "@types/webpack-node-externals": "^1.7.1",
     "@typescript-eslint/eslint-plugin": "^4.0.0",
@@ -341,8 +340,8 @@
     "typescript": "4.0.2",
     "url-loader": "^4.1.0",
     "webpack": "^5.9.0",
-    "webpack-cli": "^3.3.11",
+    "webpack-cli": "^4.2.0",
-    "webpack-dev-server": "^3.11.0",
+    "webpack-dev-server": "^4.0.0-beta.0",
     "webpack-node-externals": "^2.5.2",
     "what-input": "^5.2.10",
     "xterm": "^4.6.0",

src/main/router.ts

@@ -106,8 +106,8 @@ export class Router {
 
     try {
       const filename = path.basename(req.url);
-      // redirect requests to [appName].js, [appName].html /sockjs-node/ to webpack-dev-server (for hot-reload support)
+      // redirect requests to [appName].js, [appName].html to webpack-dev-server (for hot-reload support)
-      const toWebpackDevServer = filename.includes(appName) || filename.includes("hot-update") || req.url.includes("sockjs-node");
+      const toWebpackDevServer = filename.includes(appName) || filename.includes("hot-update");
 
       if (isDevelopment && toWebpackDevServer) {
         const redirectLocation = `http://localhost:${webpackDevServerPort}${req.url}`;

webpack.renderer.ts

@@ -21,13 +21,13 @@ export function webpackLensRenderer({ showVars = true } = {}): webpack.Configura
     context: __dirname,
     target: "electron-renderer",
     devtool: isProduction ? "source-map" : "eval-source-map",
+    // ignore because there is no @types/webpack-dev-server for v4 yet
+    // @ts-ignore
     devServer: {
-      contentBase: buildDir,
+      static: buildDir,
       port: webpackDevServerPort,
       host: "localhost",
-      hot: true,
+      firewall: false,
-      // to avoid cors errors when requests is from iframes
-      disableHostCheck: true,
       headers: { "Access-Control-Allow-Origin": "*" },
     },
     name: "lens-app",