hanmoehtet / route-level-code-split Goto Github PK

I have not been able to achieve the same results using react-router-dom version "^5.2.0" and react version "^17.0.2". Kindly help.
Here is the code

The usage in this repository is good for root level routes only.
If there are some nested routes (which are also lazy loaded..),
then the fallback value for React.Suspense will be only the nested lazy loaded "page", and that will make a bad UI for the fallback.

Assume you have a lazy loaded component X with some navbar element. Then, you configure in this component X an <Outlet />. Then, if the future-injected <Outlet> element will be lazy loaded as well, the root <React.Suspense> will be loaded with partial fallback element, as the fallback element will be the content of the <Outlet>, but the real "page" includes also the navbar, which won't be shown in the fallback state.

Is there a way to overcome it?