我正在使用 react-loadable for react-router-v4 ，我想做服务器端渲染 . 当然在服务器端我不需要延迟加载，所以我开始使用 react-loadable ，因为它说可以在 import-inspector babel插件的帮助下与服务器一起使用 .
但遗憾的是我的服务器控制台 require.ensure is not a function 出现错误，这导致我的客户端重新渲染，我失去了服务器端渲染的所有好处 .
在我使用 react-router-v3 并使用 getComponent 与 import 之前没有任何问题 .
这是我的路线配置 .
export default [
{
component: Root,
routes: [
{
path: '/',
component: Loadable({
loader: () => import('./Parent.jsx'),
loading: () => <div>Loading...</div>
}),
routes: [
{
path: '/',
exact: true,
component: Loadable({
loader: () => import('./Child.jsx'),
loading: () => <div>Loading...</div>
})
}
]
}
]
}
];
这是我 .babelrc
{
presets : [["es2015", {modules: false}], "react", "stage-2", "stage-3"],
plugins: [
"transform-runtime",
"syntax-async-functions",
"dynamic-import-webpack"
],
env: {
node: {
plugins: [
["import-inspector", {
"serverSideRequirePath": true,
"webpackRequireWeakId": true,
}],
["babel-plugin-webpack-alias", {
"config": "webpack/server.js",
"findConfig": true
}]
]
}
}
}
在客户端它完美地工作，只有错误是标记校验和差异错误 . 这应该怎么样？
提前致谢！
1 回答
尝试将此添加到babel或babel装载机
“动态导入节点”，
那是来自airbnb