title: Make Redux reducers and other non-components hot loadable
body: <p>I'm having a tough time getting my reducers to be hot swapable. </p>
  
  <p>I'm using Webpack and <code>react-transform-hmr</code>. With this, all of the CSS and the components are hot loaded when I save, but when I try and work on another type of type - most notably the reducers - it would tell me to do a full refresh.</p>
  
  <p>I figured out that this is because I need to explicitly re-load the reducers in and accept the event. Which I'm doing with this code in my <code>store.js</code>:</p>
  
  <pre><code>if(module.hot) {
    module.hot.accept('./reducers/', () =&gt; {
      const nextRootReducer = require('./reducers/index');
      store.replaceReducer(nextRootReducer);
    });
  }
  </code></pre>
  
  <p><code>reducers/index</code> exports the root reducer. </p>
  
  <p>However now when I run this it still tells me <code>[HMR] Cannot check for update (Full reload needed</code> and also errors saying <code>[HMR] TypeError: currentReducer is not a function</code></p>
  
  <p>So - I need some help getting this to work. The code is available at <a href="https://github.com/wesbos/Simple-Redux">https://github.com/wesbos/Simple-Redux</a> and you can reproduce it by doing:</p>
  
  <ol>
  <li><code>npm install</code></li>
  <li><code>npm start</code></li>
  <li>Open localhost:3000 in your browser</li>
  <li>Edit a reducer - open <code>posts.js</code> and change the number on line 6 to anything else</li>
  </ol>