@@ -212,6 +212,26 @@ export const fileSystemRoutes = async ({
212
212
return '' ;
213
213
} ;
214
214
215
+ const createLazyImport = ( {
216
+ componentPath,
217
+ routeId,
218
+ webpackChunkName,
219
+ eager,
220
+ } : {
221
+ componentPath : string ;
222
+ routeId ?: string ;
223
+ webpackChunkName ?: boolean ;
224
+ eager ?: boolean ;
225
+ } ) => {
226
+ const importOptions = webpackChunkName
227
+ ? `/* webpackChunkName: "${ routeId } " */ `
228
+ : eager
229
+ ? `/* webpackMode: "eager" */ `
230
+ : '' ;
231
+
232
+ return `() => import(${ importOptions } '${ componentPath } ').then(routeModule => handleRouteModule(routeModule, "${ routeId } ")).catch(handleRouteModuleError)` ;
233
+ } ;
234
+
215
235
const traverseRouteTree = ( route : NestedRouteForCli | PageRoute ) : Route => {
216
236
let children : Route [ 'children' ] ;
217
237
if ( 'children' in route && route . children ) {
@@ -260,25 +280,36 @@ export const fileSystemRoutes = async ({
260
280
}
261
281
262
282
if ( route . _component ) {
263
- if ( splitRouteChunks ) {
264
- if ( route . isRoot ) {
265
- lazyImport = `() => import('${ route . _component } ').then(routeModule => handleRouteModule(routeModule, "${ route . id } ")).catch(handleRouteModuleError) ` ;
266
- rootLayoutCode = `import RootLayout from '${ route . _component } '` ;
267
- component = `RootLayout` ;
268
- } else if ( ssrMode === 'string' ) {
269
- lazyImport = `() => import(/* webpackChunkName: "${ route . id } " */ '${ route . _component } ').then(routeModule => handleRouteModule(routeModule, "${ route . id } ")).catch(handleRouteModuleError) ` ;
270
- component = `loadable(${ lazyImport } )` ;
283
+ if ( route . isRoot ) {
284
+ lazyImport = createLazyImport ( {
285
+ componentPath : route . _component ,
286
+ routeId : route . id ,
287
+ } ) ;
288
+ rootLayoutCode = `import RootLayout from '${ route . _component } '` ;
289
+ component = 'RootLayout' ;
290
+ } else if ( splitRouteChunks ) {
291
+ lazyImport = createLazyImport ( {
292
+ componentPath : route . _component ,
293
+ routeId : route . id ,
294
+ webpackChunkName : true ,
295
+ } ) ;
296
+ // csr and streaming ssr use lazy
297
+ component =
298
+ ssrMode === 'string'
299
+ ? `loadable(${ lazyImport } )`
300
+ : `lazy(${ lazyImport } )` ;
301
+ } else {
302
+ if ( ssrMode === 'string' ) {
303
+ components . push ( route . _component ) ;
304
+ component = `component_${ components . length - 1 } ` ;
271
305
} else {
272
- // csr and streaming
273
- lazyImport = `() => import(/* webpackChunkName: "${ route . id } " */ '${ route . _component } ').then(routeModule => handleRouteModule(routeModule, "${ route . id } ")).catch(handleRouteModuleError) ` ;
306
+ lazyImport = createLazyImport ( {
307
+ componentPath : route . _component ,
308
+ routeId : route . id ,
309
+ eager : true ,
310
+ } ) ;
274
311
component = `lazy(${ lazyImport } )` ;
275
312
}
276
- } else if ( ssrMode === 'string' ) {
277
- components . push ( route . _component ) ;
278
- component = `component_${ components . length - 1 } ` ;
279
- } else {
280
- lazyImport = `() => import(/* webpackMode: "eager" */ '${ route . _component } ').then(routeModule => handleRouteModule(routeModule, "${ route . id } ")).catch(handleRouteModuleError) ` ;
281
- component = `lazy(${ lazyImport } )` ;
282
313
}
283
314
}
284
315
} else if ( route . _component ) {
0 commit comments