Im trying to use react loadable with server side rendering.
My babel plugins config
"plugins": [
"syntax-dynamic-import",
"dynamic-import-node",
"react-loadable/babel",
[
"import-inspector",
{
"serverSideRequirePath": true,
"webpackRequireWeakId": true
}
],
"transform-react-remove-prop-types",
"transform-react-inline-elements",
"transform-react-constant-elements"
]
server response during rendering, with:
console.log(modules);
const bundles = getBundles(stats, modules);
console.log(bundles);
gets:
[ 'HomePage' ]
[ undefined ]
i guess my error comes from react-loadable.json
which has one of the keys undefined
"undefined": [
{
"id": 7,
"name": "./node_modules/react-intl/lib/index.es.js",
"file": "main.a77d1cb1913eab1806a7.js"
},
{
"id": 19,
"name": "./node_modules/redux/es/index.js",
"file": "main.a77d1cb1913eab1806a7.js"
},
{
"id": 52,
"name": "./node_modules/redux-saga/es/internal/sagaHelpers/index.js",
"file": "main.a77d1cb1913eab1806a7.js"
}
]
but i can figure out how it becomes undefined if i have webpackChunkName
and modules defined like this:
export default Loadable({
loader: () => import(/* webpackChunkName: "HomePage" */ './index'),
loading: () => null,
modules: ['HomePage'],
});
maybe someone had similar problem or know any solution?