Can i lazy load a group of routes?

[susantpatel]

I have a group of routes like this
<Route path={RoutePaths.createCourses}> <Route index element={<Layout children={<AddCourses />} />} /> <Route path={RoutePaths.QuizBuilder} element={<QuizBuilder />} /> <Route path={RoutePaths.AssessmentBuilder} element={<QuizBuilder />} /> <Route path={RoutePaths.quiz} element={<QuizBuilder />} /> </Route>
I want the browser to load all the routes at once with lazy load and suspense.

I have tried wrapping the parent route with <Suspense fallback={<>...</>}>
But this throws an error.

Although i can wrap individual elements prop with suspense like this and it works but i want to load multiple routes at once
<Route path={RoutePaths.AssessmentBuilder} element={<Suspense><QuizBuilder /></Suspense>} />