Angular CLI 6 - Build Angular Libraries With Source Maps

I've got an Angular 6 project that I've generated using Angular CLI 6 (6.08).

I created separate libraries using the ng generate library [lib name] --prefix [lib prefix] (approach outlined in this article: https://medium.com/@tomsu/how-to-build-a-library-for-angular-apps-4f9b38b0ed11).

I build each library using ng build [lib name] and then serve my application using ng serve.

However, when I view the source in Chrome Dev Tools, my libraries don't have source maps.

I've tried building each library using ng build [lib name] --source-map (as specified here: https://github.com/angular/angular-cli/wiki/build), but I think that's only for building that application, not libraries.

Does anyone know what I'm doing wrong have an alternative solution?

To view the source code of the angular library in the consuming app. We need to do the following 2 points:

1. Enable source maps when when building the angular library.
2. Enable source maps + vendorSourceMap when building the consuming app.

To enable source maps when when building the angular library.

1. In angular.json under, projects -> library_name -> architect -> build -> options

2. Enable source maps:

   "sourceMap": {
     "scripts": true,
     "styles": true,
     "vendor": true
   }
   

To enable source maps + vendorSourceMap when building the consuming app.

1. In angular.json under, projects -> projctName -> architect -> build

2. Set sourceMap to true:

   "sourceMap": true
   

3. In angular.json under projects -> projctName -> serve -> options

4. Set vendorSourceMap to true:

   "vendorSourceMap": true
   

Finally run the consuming app using the command:

ng serve --vendor-source-map