Improve: hot reload

This commit is contained in:
Jason 2018-10-05 15:19:57 +08:00
parent 1a202dea98
commit 26541f22fc
3 changed files with 12 additions and 35 deletions

View File

@ -1,5 +1,6 @@
import * as React from 'react' import * as React from 'react'
import { Route } from 'react-router-dom' import { Route } from 'react-router-dom'
import { hot } from 'react-hot-loader'
import { I18nProps } from '@i18n' import { I18nProps } from '@i18n'
import './App.scss' import './App.scss'
@ -13,6 +14,7 @@ import SlideBar from '@containers/Sidebar'
export interface AppProps extends I18nProps { export interface AppProps extends I18nProps {
} }
@hot(module)
export default class App extends React.Component<AppProps, {}> { export default class App extends React.Component<AppProps, {}> {
render () { render () {
const routes = [ const routes = [

View File

@ -24,7 +24,6 @@ OfflinePluginRuntime.install({
// Reload the webpage to load into the new version // Reload the webpage to load into the new version
window.location.reload() window.location.reload()
}, },
onUpdateFailed: () => { onUpdateFailed: () => {
console.error('SW Event:', 'onUpdateFailed') console.error('SW Event:', 'onUpdateFailed')
} }

View File

@ -3,45 +3,21 @@ import { render } from 'react-dom'
import { Provider } from 'mobx-react' import { Provider } from 'mobx-react'
import { HashRouter } from 'react-router-dom' import { HashRouter } from 'react-router-dom'
import { I18nextProvider } from 'react-i18next' import { I18nextProvider } from 'react-i18next'
import { AppContainer } from 'react-hot-loader'
import { rootStores } from '@lib/createStore' import { rootStores } from '@lib/createStore'
import App from '@containers/App' import App from '@containers/App'
import i18n from '@i18n' import i18n from '@i18n'
const rootEl = document.getElementById('root')
// Hot Module Replacement API
declare let module: { hot: any }
export default function renderApp () { export default function renderApp () {
render( const rootEl = document.getElementById('root')
<AppContainer> const AppInstance = (
<Provider {...rootStores}> <Provider {...rootStores}>
<HashRouter> <HashRouter>
<I18nextProvider i18n={ i18n }> <I18nextProvider i18n={ i18n }>
<App /> <App />
</I18nextProvider> </I18nextProvider>
</HashRouter> </HashRouter>
</Provider> </Provider>
</AppContainer>,
rootEl
) )
if (module.hot) { render(AppInstance, rootEl)
module.hot.accept('./containers/App', () => {
const NewApp = require('./containers/App').default
render(
<AppContainer>
<Provider {...rootStores}>
<HashRouter>
<I18nextProvider i18n={ i18n }>
<NewApp />
</I18nextProvider>
</HashRouter>
</Provider>
</AppContainer>,
rootEl
)
})
}
} }