Angular 11 Only 1 library in Lazy chunk files when ng build

Question

I have a two libraries that are built into node_modules directory. I use libray1 in library2 and use both in app-routing.module.ts to lazy load routes in both libraries. When I ng build the main app, It shows only library2 under Lazy chunk files.

Initial Chunk Files | Names         |      Size
vendor.js           | vendor        |   3.46 MB
styles.css          | styles        | 176.72 kB
polyfills.js        | polyfills     | 136.13 kB
main.js             | main          |  10.84 kB
runtime.js          | runtime       |   9.00 kB
                    | Initial Total |   3.78 MB

Lazy Chunk Files    | Names         |      Size
library2.js    | library2 |  35.98 kB

Here is app-routing.module.ts

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';

const routes: Routes = [
  {
    path: 'account',
    loadChildren: () => import('library1').then(m => m.AccountRoutingModule)
  }, {
    path: 'cars',
    loadChildren: () => import('library2').then(m => m.CarRoutingModule)
  }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule {
}

I can't figure out why this is the case. I suspected it might be caused by importing library1 module in library2 but I checked out and build result does not change. Anyone can point me to the right direction about why this is happening?

@zainhassan I did that to lazily load the children routes. I recently changed it to main modules like 'CarModule' but the output did not change. Do you have any idea about what should I do? — Dogukan Evcil, Feb 15 '21 at 07:54
Make sure you have not imported modules in loadchildren anywhere else — zainhassan, Feb 15 '21 at 07:59
Yes that was it, I was importing something from library1 in `app.component.ts`. Thanks for the pointer. — Dogukan Evcil, Feb 15 '21 at 08:29

Angular 11 Only 1 library in Lazy chunk files when ng build

0 Answers0