ANGLE CLI 6-使用源图构建角库 [英] Angular CLI 6 - Build Angular Libraries With Source Maps

问题描述

我有一个使用角度CLI 6(6.08)生成的角度6项目。

我使用ng generate library [lib name] --prefix [lib prefix](本文概述的方法：https://medium.com/@tomsu/how-to-build-a-library-for-angular-apps-4f9b38b0ed11)创建了单独的库。

我使用ng build [lib name]构建每个库，然后使用ng serve为我的应用程序提供服务。

但是，当我在Chrome Dev工具中查看源代码时，我的库没有源代码映射。

我尝试使用ng build [lib name] --source-map(此处指定：https://github.com/angular/angular-cli/wiki/build)构建每个库，但我认为这仅用于构建该应用程序，而不是库。

有人知道我做错了什么吗？有其他解决方案吗？

推荐答案

查看消费APP中角库的源代码。 我们需要做好以下两点：

1. 生成角度库时启用源图。
2. 生成消费应用时启用源地图+vendorSourceMap。

在构建角度库时启用源贴图。

1. 在angular.json中，项目->；库名称->；Architect-；构建-&>选项

2. 启用源映射：

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

在构建消费应用时启用源地图+vendorSourceMap。

1. 在angular.json中，项目->；项目名称->；架构师-&>构建

2. 将sourceMap设置为true：

   "sourceMap": true
   

3. 在angular.json项目->；项目名称->；服务-&>选项下

4. 将vendorSourceMap设置为true：

   "vendorSourceMap": true
   

最后使用以下命令运行消费应用程序：

ng serve --vendor-source-map

这篇关于ANGLE CLI 6-使用源图构建角库的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！