fix: legacy initial for webpack v4

webpack · Aug 18, 2021 · 3fb6685 · 3fb6685
1 parent 9f7a054
commit 3fb6685
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 6 deletions.
diff --git a/client-src/index.js b/client-src/index.js
@@ -10,7 +10,13 @@ import sendMessage from "./utils/sendMessage.js";
 import reloadApp from "./utils/reloadApp.js";
 import createSocketURL from "./utils/createSocketURL.js";
 
-const status = { isUnloading: false, currentHash: __webpack_hash__ };
+const status = {
+  isUnloading: false,
+  // TODO Workaround for webpack v4, `__webpack_hash__` is not replaced without HotModuleReplacement
+  // eslint-disable-next-line camelcase
+  currentHash: typeof __webpack_hash__ !== "undefined" ? __webpack_hash__ : "",
+};
+// console.log(__webpack_hash__);
 const options = {
   hot: false,
   liveReload: false,

diff --git a/client-src/utils/reloadApp.js b/client-src/utils/reloadApp.js
@@ -3,14 +3,28 @@
 import hotEmitter from "webpack/hot/emitter.js";
 import { log } from "./log.js";
 
-function reloadApp({ hot, liveReload }, { isUnloading, currentHash }) {
-  if (isUnloading) {
+function reloadApp({ hot, liveReload }, status) {
+  if (status.isUnloading) {
     return;
   }
 
-  const isInitial = currentHash.indexOf(__webpack_hash__) === 0;
+  // TODO Workaround for webpack v4, `__webpack_hash__` is not replaced without HotModuleReplacement plugin
+  const webpackHash =
+    // eslint-disable-next-line camelcase
+    typeof __webpack_hash__ !== "undefined"
+      ? // eslint-disable-next-line camelcase
+        __webpack_hash__
+      : status.previousHash || "";
+  const isInitial = status.currentHash.indexOf(webpackHash) === 0;
 
   if (isInitial) {
+    const isLegacyInitial =
+      webpackHash === "" && hot === false && liveReload === true;
+
+    if (isLegacyInitial) {
+      status.previousHash = status.currentHash;
+    }
+
     return;
   }
 
@@ -30,11 +44,11 @@ function reloadApp({ hot, liveReload }, { isUnloading, currentHash }) {
   if (hot && allowToHot) {
     log.info("App hot update...");
 
-    hotEmitter.emit("webpackHotUpdate", currentHash);
+    hotEmitter.emit("webpackHotUpdate", status.currentHash);
 
     if (typeof self !== "undefined" && self.window) {
       // broadcast update to window
-      self.postMessage(`webpackHotUpdate${currentHash}`, "*");
+      self.postMessage(`webpackHotUpdate${status.currentHash}`, "*");
     }
   }
   // allow refreshing the page only if liveReload isn't disabled