This is a react-router component lazyload example with TC39 Stage-3 syntax import()
Checkout the file ./src/Router.js
$ yarn
$ npm startCheckout http://0.0.0.0:8080/
$ npm run Build
# Then checkout ./buildIf you are using docker, to see the build results, you can run:
$ docker-compose upThen checkout http://localhost/
function lazyLoad (moduleName) {
return function (location, cb) {
import(`./components/${moduleName}`)
.then(module => cb(null, module.default))
.catch(err => console.error(err))
}
}
export default function Root () {
return (
<Router history={hashHistory}>
<Route path='/' component={App}>
<Route path='/home' getComponent={lazyLoad('Home')} />
<Route path='/posts' getComponent={lazyLoad('Posts')}>
<Route path=':id' getComponent={lazyLoad('Article')} />
</Route>
<Route path='/about' getComponent={lazyLoad('About')} />
</Route>
</Router>
)
}