Add webpack hot-reload/cache plugins to improve Lens DX (#1250)

* Add webpack-dev-server (for hot module replacement) to serve statics, add HardSourceWebpackPlugin to improve re-compiling speed

* Serve statics using webpack-dev-server instead of lens-proxy, redirect request of Lens.html/Lens.js to webpack-dev-server

* Add react-refresh-webpack-plugin and its dep for hot-reload

* Add hot-reload plugin, and make proxy redirects requests to webpackdevserver

* Add hard-source webpack plugin to main process

* Remove parameter 'path' of handleStaticFile

* Upgarde webpack to v4 latest stable

* Fix build error: plugins shouldnt be null

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

package.json

@@ -15,7 +15,7 @@
     "dev-build": "concurrently yarn:compile:*",
     "dev-run": "nodemon --watch static/build/main.js --exec \"electron --inspect .\"",
     "dev:main": "yarn compile:main --watch",
-    "dev:renderer": "yarn compile:renderer --watch",
+    "dev:renderer": "yarn webpack-dev-server --config webpack.renderer.ts",
     "dev:extension-types": "yarn compile:extension-types --watch",
     "compile": "env NODE_ENV=production concurrently yarn:compile:*",
     "compile:main": "webpack --config webpack.main.ts",
@@ -268,6 +268,7 @@
     "@lingui/macro": "^3.0.0-13",
     "@lingui/react": "^3.0.0-13",
     "@material-ui/core": "^4.10.1",
+    "@pmmmwh/react-refresh-webpack-plugin": "^0.4.3",
     "@rollup/plugin-json": "^4.1.0",
     "@testing-library/jest-dom": "^5.11.5",
     "@testing-library/react": "^11.1.0",
@@ -279,6 +280,7 @@
     "@types/electron-window-state": "^2.0.34",
     "@types/fs-extra": "^9.0.1",
     "@types/hapi": "^18.0.3",
+    "@types/hard-source-webpack-plugin": "^1.0.1",
     "@types/hoist-non-react-statics": "^3.3.1",
     "@types/html-webpack-plugin": "^3.2.3",
     "@types/http-proxy": "^1.17.4",
@@ -315,6 +317,7 @@
     "@types/uuid": "^8.0.0",
     "@types/webdriverio": "^4.13.0",
     "@types/webpack": "^4.41.17",
+    "@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",
@@ -339,6 +342,7 @@
     "file-loader": "^6.0.0",
     "flex.box": "^3.4.4",
     "fork-ts-checker-webpack-plugin": "^5.0.0",
+    "hard-source-webpack-plugin": "^0.13.1",
     "hoist-non-react-statics": "^3.3.2",
     "html-webpack-plugin": "^4.3.0",
     "identity-obj-proxy": "^3.0.0",
@@ -360,6 +364,7 @@
     "react": "^16.14.0",
     "react-beautiful-dnd": "^13.0.0",
     "react-dom": "^16.13.1",
+    "react-refresh": "^0.9.0",
     "react-router": "^5.2.0",
     "react-router-dom": "^5.2.0",
     "react-select": "^3.1.0",
@@ -376,11 +381,13 @@
     "ts-jest": "^26.1.0",
     "ts-loader": "^7.0.5",
     "ts-node": "^8.10.2",
+    "type-fest": "^0.18.0",
     "typeface-roboto": "^0.0.75",
     "typescript": "^4.0.2",
     "url-loader": "^4.1.0",
-    "webpack": "^4.43.0",
+    "webpack": "^4.44.2",
     "webpack-cli": "^3.3.11",
+    "webpack-dev-server": "^3.11.0",
     "webpack-node-externals": "^1.7.2",
     "xterm": "^4.6.0",
     "xterm-addon-fit": "^0.4.0"