react-async-bootstrapper
react-async-bootstrapper copied to clipboard
can not use dynamic import
when i use dynamic import in react router as follows, the following problem has occurred the error only occurred in development mode, not in production mode
import React from 'react'
import { Route, Redirect, withRouter, } from 'react-router-dom'
import Loadable from 'react-loadable'
import CircularProgress from '@material-ui/core/CircularProgress'
// right
// import TopicList from 'views/topic-list'
// import TopicDetail from 'views/topic-detail'
// import TopicCreate from 'views/topic-create'
// import UserLogin from 'views/user/login'
// import UserInfo from 'views/user/info'
// wrong
const TopicList = Loadable({
loader: () => import('views/topic-list'),
loading() {
return <CircularProgress />
},
})
const TopicDetail = Loadable({
loader: () => import('views/topic-detail'),
loading() {
return <CircularProgress />
},
})
const TopicCreate = Loadable({
loader: () => import('views/topic-create'),
loading() {
return <CircularProgress />
},
})
const UserLogin = Loadable({
loader: () => import('views/user/login'),
loading() {
return <CircularProgress />
},
})
const UserInfo = Loadable({
loader: () => import('views/user/info'),
loading() {
return <CircularProgress />
},
})
export default () => [
<Route exact render={() => <Redirect to="/list" />} path="/" key="home" />,
<Route component={TopicList} path="/list" key="list" />,
<Route component={TopicDetail} path="/detail/:id" key="detail" />,
]
{ Error: Cannot find module './0.server-entry.js'
at Function.Module._resolveFilename (module.js:548:15)
at Function.Module._load (module.js:475:25)
at Module.require (module.js:597:17)
at require (internal/module.js:11:18)
at Function.requireEnsure [as e] (server-entry.js:46:25)
at loader (webpack:///./client/router/index.jsx?:69:60)
at load (/Users/ender/learning/github/react-cnode/node_modules/react-loadable/lib/index.js:28:17)
at init (/Users/ender/learning/github/react-cnode/node_modules/react-loadable/lib/index.js:121:13)
at new LoadableComponent (/Users/ender/learning/github/react-cnode/node_modules/react-loadable/lib/index.js:150:7)
at /Users/ender/learning/github/react-cnode/node_modules/react-tree-walker/dist/react-tree-walker.js:174:30 code: 'MODULE_NOT_FOUND' }