I am trying to use @loadable/component
library with React at the app that uses SSR, Redux and Router.
The docs gives an example application code, but it's without Router and Redux (no need to pass state and render routes).
The file src/server/main.js
from the example contains such lines:
const nodeExtractor = new ChunkExtractor({ statsFile: nodeStats })
const { default: App } = nodeExtractor.requireEntrypoint()
const webExtractor = new ChunkExtractor({ statsFile: webStats })
const jsx = webExtractor.collectChunks(<App />)
const html = renderToString(jsx)
But my app's server-side JSX looks like this (without < App/>), I have provider and static router component wrapper:
const jsx = (
<Provider store={store}>
<StaticRouter location={req.url} context={context}>
{renderRoutes(routes, params)}
</StaticRouter>
</Provider>
);
Could you please tell me, how I could use store
and StaticRouter
with renderRoutes(...)
and this @loadable/component
so that my SSR work?
Thank you!