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?