fix: lazy load routes to get under the build budget

angular-architects · May 13, 2024 · 729c84d · 729c84d
1 parent 7ef7ef0
commit 729c84d
Show file tree

Hide file tree

Showing 3 changed files with 419 additions and 598 deletions.
diff --git a/apps/demo/src/app/app.routes.ts b/apps/demo/src/app/app.routes.ts
@@ -10,22 +10,8 @@ import { FlightSearchReducConnectorComponent } from './flight-search-redux-conne
 import { provideFlightStore } from './flight-search-redux-connector/+state/redux';
 
 export const appRoutes: Route[] = [
-  { path: 'todo', component: TodoComponent },
-  { path: 'flight-search', component: FlightSearchComponent },
   {
-    path: 'flight-search-data-service-simple',
-    component: FlightSearchSimpleComponent,
-  },
-  { path: 'flight-edit-simple/:id', component: FlightEditSimpleComponent },
-  {
-    path: 'flight-search-data-service-dynamic',
-    component: FlightSearchDynamicComponent,
-  },
-  { path: 'flight-edit-dynamic/:id', component: FlightEditDynamicComponent },
-  { path: 'todo-storage-sync', component: TodoStorageSyncComponent },
-  {
-    path: 'flight-search-redux-connector',
-    providers: [provideFlightStore()],
-    component: FlightSearchReducConnectorComponent
+    path: '',
+    loadChildren: () => import('./lazy-routes').then((m) => m.lazyRoutes),
   },
 ];
diff --git a/apps/demo/src/app/lazy-routes.ts b/apps/demo/src/app/lazy-routes.ts
@@ -0,0 +1,31 @@
+import { Route } from '@angular/router';
+import { TodoComponent } from './todo/todo.component';
+import { FlightSearchComponent } from './flight-search/flight-search.component';
+import { FlightSearchSimpleComponent } from './flight-search-data-service-simple/flight-search-simple.component';
+import { FlightEditSimpleComponent } from './flight-search-data-service-simple/flight-edit-simple.component';
+import { FlightSearchDynamicComponent } from './flight-search-data-service-dynamic/flight-search.component';
+import { FlightEditDynamicComponent } from './flight-search-data-service-dynamic/flight-edit.component';
+import { TodoStorageSyncComponent } from './todo-storage-sync/todo-storage-sync.component';
+import { provideFlightStore } from './flight-search-redux-connector/+state/redux';
+import { FlightSearchReducConnectorComponent } from './flight-search-redux-connector/flight-search.component';
+
+export const lazyRoutes: Route[] = [
+  { path: 'todo', component: TodoComponent },
+  { path: 'flight-search', component: FlightSearchComponent },
+  {
+    path: 'flight-search-data-service-simple',
+    component: FlightSearchSimpleComponent,
+  },
+  { path: 'flight-edit-simple/:id', component: FlightEditSimpleComponent },
+  {
+    path: 'flight-search-data-service-dynamic',
+    component: FlightSearchDynamicComponent,
+  },
+  { path: 'flight-edit-dynamic/:id', component: FlightEditDynamicComponent },
+  { path: 'todo-storage-sync', component: TodoStorageSyncComponent },
+  {
+    path: 'flight-search-redux-connector',
+    providers: [provideFlightStore()],
+    component: FlightSearchReducConnectorComponent,
+  },
+];