fix: perform a HMR update after inserting a new CSS module

Fixes #706
webpack-contrib · Mar 13, 2023 · 048c8f1 · 048c8f1
1 parent 1d226c1
commit 048c8f1
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 2 deletions.
diff --git a/src/hmr/hotModuleReplacement.js b/src/hmr/hotModuleReplacement.js
@@ -246,6 +246,8 @@ function isUrlRequest(url) {
   return true;
 }
 
+const updateFunctionMap = Object.create(null);
+
 /**
  * @param {TODO} moduleId
  * @param {TODO} options
@@ -258,6 +260,11 @@ module.exports = function (moduleId, options) {
     return noop;
   }
 
+  const key = JSON.stringify({ moduleId, options });
+  if (updateFunctionMap[key]) {
+    return updateFunctionMap[key];
+  }
+
   const getScriptSrc = getCurrentScriptUrl(moduleId);
 
   function update() {
@@ -281,5 +288,6 @@ module.exports = function (moduleId, options) {
     }
   }
 
-  return debounce(update, 50);
+  updateFunctionMap[key] = debounce(update, 50);
+  return updateFunctionMap[key];
 };
diff --git a/src/loader.js b/src/loader.js
@@ -60,6 +60,9 @@ function hotLoader(content, context) {
   })});
       module.hot.dispose(cssReload);
       ${accept}
+      if (module.hot.status() !== "idle") {
+        cssReload();
+      }
     }
   `;
 }

diff --git a/test/cases/hmr/expected/main.js b/test/cases/hmr/expected/main.js
@@ -255,6 +255,8 @@ function isUrlRequest(url) {
   return true;
 }
 
+const updateFunctionMap = Object.create(null);
+
 /**
  * @param {TODO} moduleId
  * @param {TODO} options
@@ -267,6 +269,11 @@ module.exports = function (moduleId, options) {
     return noop;
   }
 
+  const key = JSON.stringify({ moduleId, options });
+  if (updateFunctionMap[key]) {
+    return updateFunctionMap[key];
+  }
+
   const getScriptSrc = getCurrentScriptUrl(moduleId);
 
   function update() {
@@ -290,7 +297,8 @@ module.exports = function (moduleId, options) {
     }
   }
 
-  return debounce(update, 50);
+  updateFunctionMap[key] = debounce(update, 50);
+  return updateFunctionMap[key];
 };
 
 
@@ -367,6 +375,9 @@ __webpack_require__.r(__webpack_exports__);
       var cssReload = __webpack_require__(/*! ../../../src/hmr/hotModuleReplacement.js */ "../../../src/hmr/hotModuleReplacement.js")(module.id, {"locals":false});
       module.hot.dispose(cssReload);
       module.hot.accept(undefined, cssReload);
+      if (module.hot.status() !== "idle") {
+        cssReload();
+      }
     }