I currently have the following lazy component imports:
const LazyDashboard = React.lazy(() => import('./pages/app/Dashboard'));
const LazyProfile = React.lazy(() => import('./pages/app/Profile'));
Then in the routes,
{userToken && <><Route exact path="/app" element={<LazyDashboard/>}/>
<Route exact path="/app" element={<LazyProfile/>}/></>}
- Going to the dashboard, a chunk is loaded in. Good!
- Going to the profile, another chunk is loaded in.. Not good! How do I mark these two imports to be bundled in the same chunk?
Is there any way to do this with React.lazy?