Горячая перезагрузка работает после изменения состояния в магазине

Question

Я хочу добавить горячую перезагрузку в мое существующее приложение реакции. Я использовал реактив-горячий загрузчик, чтобы интегрировать горячую перезагрузку в мое приложение. Вот мой код для интеграции горячей перезагрузки. Это работает нормально, но всякий раз, когда я пытаюсь изменить файл, он не работает, если мы переходим на другую страницу, тогда это работает. Я не понимаю, почему это не работает, но мне нужно решение, чтобы решить эту проблему.

configureStore.js

import createHistory from 'history/createHashHistory';
import { createStore, applyMiddleware, compose } from 'redux';
import { routerMiddleware } from 'react-router-redux';
import Thunk from 'redux-thunk';

import reducers from '../reducers';

// Create a history of your choosing (we're using a hash history in this case)
export const history = createHistory();

// Build the middleware for intercepting and dispatching navigation actions
const middleware = routerMiddleware(history);

export function configureStore(initialState) {

    const store = createStore(
        reducers,
        initialState,
        compose(applyMiddleware(middleware, Thunk))
    );

    if (module.hot) {
        module.hot.accept("../reducers/index", () => {
            const newRootReducer = require("../reducers/index").default;
            store.replaceReducer(newRootReducer)
        });
    }


    return store;
}

index.js (точка входа)

import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import MomentUtils from 'material-ui-pickers/utils/moment-utils';
import DateFnsUtils from 'material-ui-pickers/utils/date-fns-utils';
import MuiPickersUtilsProvider from 'material-ui-pickers/utils/MuiPickersUtilsProvider';
import { createStore } from 'redux';
import { ConnectedRouter } from 'react-router-redux';
import { Router, Route, Switch } from 'react-router-dom';
import createHistory from 'history/createHashHistory';

// css
import './lib/appCss';

// firebase
import './firebase';

import { configureStore } from './configureStore';

// Create a history of your choosing (we're using a hash history in this case)
const history = createHistory();

// Save a reference to the root element for reuse
const rootEl = document.getElementById("root");

// Create a reusable render method that we can call more than once
let render = () => {
  // Dynamically import our main App component, and render it
  const App = require("./container/App").default;

  ReactDOM.render(
    <Provider store={configureStore()}>
      <MuiPickersUtilsProvider utils={DateFnsUtils}>
        <Router history={history}>
          <Switch>
            <Route path="/" component={App} />
          </Switch>
        </Router>
      </MuiPickersUtilsProvider>
    </Provider>,
    rootEl
  );
};

if (module.hot) {
  // Support hot reloading of components
  // and display an overlay for runtime errors
  const renderApp = render;
  const renderError = (error) => {
    const RedBox = require("redbox-react").default;
    ReactDOM.render(
      <RedBox error={error} />,
      rootEl,
    );
  };

  // In development, we wrap the rendering function to catch errors,
  // and if something breaks, log the error and render it to the screen
  render = () => {
    try {
      renderApp();
    }
    catch (error) {
      console.error(error);
      renderError(error);
    }
  };

  // Whenever the App component file or one of its dependencies
  // is changed, re-import the updated component and re-render it
  module.hot.accept("./container/App", () => {
    setTimeout(render);
  });
}

render();