Description
I'm experiencing several points of confusion over the whenComponentsReady()
function and how to use it.
First of all, the README seems to be out of date. It indicates that a version of the function is exported from both the server-side API and client-side API at react-imported-component/server
and react-imported-component/boot
respectively. However, the former export doesn't seem to exist. A version is exported from the main package react-imported-component
. The two exported versions appear to be identical.
The documentation for the server side says the returned promise will be resolved "when all components are loaded." I'm confused about what "all" means here -- does it mean every possible chunk? Should it therefore be called once on server startup and then never again, or should it be called on each request handler?
I'm trying to use it in conjuction with the Apollo GraphQL library, which has a function getDataFromTree
which is meant to gather all the GraphQL queries needed by the tree. I tried putting whenComponentsReady
before it like this:
await whenComponentsReady();
console.log("Doing getDataFromTree");
await getDataFromTree(app);
console.log("Finished getDataFromTree");
However, I always get the following error message on the first request served by my server:
react-imported-component: using not resolved loadable. You should `await whenComponentsReady()`.
The log statements allow me to confirm this error message is happening while getDataFromTree
is running. The fact that this happens is messing up the server-side render because some of the GraphQL queries are missed.
I've tried sprinkling await whenComponentsReady()
calls in various other places but no luck. I'm also confused because whenComponentsReady()
doesn't seem to be used in any of the examples in this repo.
Any help would be much appreciated!