From 560a9f490bdcac89b29a03b7d9c471ff21ff6619 Mon Sep 17 00:00:00 2001
From: Haja Rasoahaingo <haja.rasoah@gmail.com>
Date: Wed, 12 Sep 2018 03:26:07 +0200
Subject: [PATCH] Fix HMR : client was not working + mismatch between
 server/client (#749)

---
 examples/with-react-loadable/src/client.js | 23 +++++++++++++++-------
 examples/with-react-loadable/src/index.js  |  3 ++-
 2 files changed, 18 insertions(+), 8 deletions(-)

diff --git a/examples/with-react-loadable/src/client.js b/examples/with-react-loadable/src/client.js
index ce2b4b9a2..13b520e38 100644
--- a/examples/with-react-loadable/src/client.js
+++ b/examples/with-react-loadable/src/client.js
@@ -1,20 +1,29 @@
-import App from './App';
 import React from 'react';
 import { hydrate } from 'react-dom';
 import Loadable from 'react-loadable';
 import BrowserRouter from 'react-router-dom/BrowserRouter';
+import App from './App';
+
+const root = document.getElementById('root');
 
 window.main = () => {
+  render(App);
+};
+
+if (module.hot) {
+  module.hot.accept('./App', () => {
+    const NewApp = require('./App').default;
+    render(NewApp);
+  });
+}
+
+function render(Root) {
   Loadable.preloadReady().then(() => {
     hydrate(
       <BrowserRouter>
-        <App />
+        <Root />
       </BrowserRouter>,
-      document.getElementById('root')
+      root,
     );
   });
 }
-
-if (module.hot) {
-  module.hot.accept();
-}
diff --git a/examples/with-react-loadable/src/index.js b/examples/with-react-loadable/src/index.js
index 0d37ba448..170c6ac81 100644
--- a/examples/with-react-loadable/src/index.js
+++ b/examples/with-react-loadable/src/index.js
@@ -13,10 +13,11 @@ Loadable.preloadAll().then(() => {
 if (module.hot) {
   console.log('✅  Server-side HMR Enabled!');
 
-  module.hot.accept('./server', () => {
+  module.hot.accept('./server', async () => {
     console.log('🔁  HMR Reloading `./server`...');
     server.removeListener('request', currentApp);
     const newApp = require('./server').default;
+    await Loadable.preloadAll();
     server.on('request', newApp);
     currentApp = newApp;
   });