Wrap root component in root.js not app.js so hot reloading can work

React-hot-loader v3 requires all sub components to be required in a different file.
gatsbyjs · Oct 31, 2016 · 36f2c16 · 36f2c16
1 parent 2d2c048
commit 36f2c16
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 7 deletions.
diff --git a/lib/intermediate-representation-dir/app.js b/lib/intermediate-representation-dir/app.js
@@ -10,11 +10,9 @@ const rootElement = document.getElementById(`react-mount`)
 let Root = require('./root')
 if (Root.default) { Root = Root.default }
 
-// Let site, plugins wrap the site e.g. for Redux.
-const WrappedRoot = apiRunner('wrapRootComponent', { Root: Root }, Root)
 ReactDOM.render(
  <HotContainer>
- <WrappedRoot />
+ <Root />
  </HotContainer>,
  rootElement
 )
@@ -23,11 +21,9 @@ if (module.hot) {
  module.hot.accept(`./root`, () => {
  let NextRoot = require('./root')
  if (NextRoot.default) { NextRoot = NextRoot.default }
- // Let site, plugins wrap the site e.g. for Redux.
- const WrappedRoot = apiRunner('wrapRootComponent', { Root: NextRoot }, NextRoot)
  ReactDOM.render(
  <HotContainer>
- <WrappedRoot />
+ <NextRoot />
  </HotContainer>,
  rootElement
  )

diff --git a/lib/intermediate-representation-dir/root.js b/lib/intermediate-representation-dir/root.js
@@ -30,4 +30,7 @@ const Root = () => (
  />
 )
 
-export default Root
+// Let site, plugins wrap the site e.g. for Redux.
+const WrappedRoot = apiRunner('wrapRootComponent', { Root: Root }, Root)
+
+export default WrappedRoot