我有一个基于http://moduscreate.com/code-splitting-for-react-router-with-es6-imports/文章的应用程序。我添加了一些子路由,现在我的路由器配置是这样的:
function errorLoading(err) {
console.error('Dynamic page loading failed', err);
}
function loadRoute(cb) {
console.log('load route called');
return (module) => cb(null, module.default);
}
const obj = {
component: App,
childRoutes: [
{
path: '/',
getComponent(location, cb) {
System.import('pages/Home')
.then(loadRoute(cb))
.catch(errorLoading);
}
},
{
path: '/gsgs',
getComponent(location, cb) {
System.import('pages/Gsgs')
.then(loadRoute(cb))
.catch(errorLoading);
},
childRoutes: [
{
path: 'go',
getComponent(location, cb) {
System.import('pages/Gsgs/Home.js')
.then(loadRoute(cb))
.catch(errorLoading);
},
}
]
},
{
path: '/about',
getComponent(location, cb) {
System.import('pages/About')
.then(loadRoute(cb))
.catch(errorLoading);
}
},
]
};
/ index,/ about和/ gsgs routes触发动态代码加载就好了。但是/ gsgs / go会使用
触发404bundle.js:2动态页面加载失败错误:加载块0 失败。(...)
我做错了什么?我正在使用
"webpack": "^2.1.0-beta.4", "webpack-dev-server": "^2.0.0-beta"
答案 0 :(得分:0)
检查您的配置文件(在我的情况下为webpack.config.dev.js
文件),然后检查publicPath
并将其设置为'/'
。例如:publicPath: '/'
。
您需要像这样在output
中进行设置
output: {
path: __dirname,
filename: 'app.js',
publicPath: '/',
/*publicPath: 'http://0.0.0.0:8000/',*/
}
我遇到此错误
`http://0.0.0.0:8000/0.app.js
Error: "Loading chunk 0 failed."`
,并通过将publicPath: 'http://0.0.0.0:8000/'
更改为publicPath: '/'
来解决。