You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
93 lines
2.7 KiB
JavaScript
93 lines
2.7 KiB
JavaScript
import React from 'react'
|
|
import ReactDOM from 'react-dom'
|
|
import createBrowserHistory from 'history/lib/createBrowserHistory'
|
|
import { useRouterHistory } from 'react-router'
|
|
import { syncHistoryWithStore } from 'react-router-redux'
|
|
import createStore from './store/createStore'
|
|
import AppContainer from './containers/AppContainer'
|
|
|
|
String.prototype.capitalize = function() {
|
|
return this.charAt(0).toUpperCase() + this.slice(1);
|
|
}
|
|
|
|
// ========================================================
|
|
// Browser History Setup
|
|
// ========================================================
|
|
const browserHistory = useRouterHistory(createBrowserHistory)({
|
|
basename: __BASENAME__
|
|
})
|
|
|
|
// ========================================================
|
|
// Store and History Instantiation
|
|
// ========================================================
|
|
// Create redux store and sync with react-router-redux. We have installed the
|
|
// react-router-redux reducer under the routerKey "router" in src/routes/index.js,
|
|
// so we need to provide a custom `selectLocationState` to inform
|
|
// react-router-redux of its location.
|
|
const initialState = window.___INITIAL_STATE__
|
|
const store = createStore(initialState, browserHistory)
|
|
const history = syncHistoryWithStore(browserHistory, store, {
|
|
selectLocationState: (state) => state.router
|
|
})
|
|
|
|
// ========================================================
|
|
// Developer Tools Setup
|
|
// ========================================================
|
|
if (__DEBUG__) {
|
|
if (window.devToolsExtension) {
|
|
window.devToolsExtension.open()
|
|
}
|
|
}
|
|
|
|
// ========================================================
|
|
// Render Setup
|
|
// ========================================================
|
|
const MOUNT_NODE = document.getElementById('root')
|
|
|
|
let render = () => {
|
|
const routes = require('./routes/index').default(store)
|
|
ReactDOM.render(
|
|
<AppContainer
|
|
store={store}
|
|
history={history}
|
|
routes={routes}
|
|
/>,
|
|
MOUNT_NODE
|
|
)
|
|
}
|
|
|
|
// This code is excluded from production bundle
|
|
if (__DEV__) {
|
|
if (module.hot) {
|
|
// Development render functions
|
|
const renderApp = render
|
|
|
|
const renderError = (error) => {
|
|
const RedBox = require('redbox-react').default
|
|
ReactDOM.render(<RedBox error={error} />, MOUNT_NODE)
|
|
}
|
|
|
|
// Wrap render in try/catch
|
|
render = () => {
|
|
try {
|
|
renderApp()
|
|
} catch (error) {
|
|
renderError(error)
|
|
}
|
|
}
|
|
|
|
// Setup hot module replacement
|
|
module.hot.accept('./routes/index', () => {
|
|
setTimeout(() => {
|
|
ReactDOM.unmountComponentAtNode(MOUNT_NODE)
|
|
render()
|
|
})
|
|
})
|
|
}
|
|
}
|
|
|
|
// ========================================================
|
|
// Go!
|
|
// ========================================================
|
|
render()
|