import React, { lazy, Suspense } from 'react'; import ReactDOM from 'react-dom'; import 'bootstrap/dist/css/bootstrap.css'; // Important because our Bootstrap CSS comes from here import { createBrowserHistory } from 'history'; import { ConnectedRouter } from 'connected-react-router'; import { Provider } from 'react-redux'; import App from './App'; import configureStore from './store'; import './index.css'; import Loading from './components/Loading'; import { initializeGA, registerPageView } from './api/googleAnalytics'; const basename = process.env.REACT_APP_ROUTER_BASENAME || ''; const history = createBrowserHistory({ basename }); const store = configureStore({}, history); const rootElement = document.getElementById('root'); initializeGA(); history.listen(location => { registerPageView(location.pathname); }); ReactDOM.render( <Provider store={store}> <ConnectedRouter history={history}> <App history={history} /> </ConnectedRouter> </Provider>, rootElement ); if (module.hot) { module.hot.accept('./App', () => { const NextApp = lazy(() => <App />); ReactDOM.render( <Provider store={store}> <Suspense fallback={<Loading />}> <NextApp history={history} /> </Suspense> </Provider>, rootElement ); }); }