如何在使用CLI创建的Angular库中包含第三方模块

时间:2018-09-08 15:01:16

标签: angular angular-cli-v6 ng-packagr

我想在使用CLI generate library命令创建的Angular库中使用Pure.css模块。

我有一个工作区应用程序,在其中运行了generate library命令来创建库。该库已成功创建,我可以将其链接并安装到其他项目中。但是,我想使用Pure.css库中的网格系统,在工作区应用程序的angular.json文件(包含该库的应用程序)中,我在库项目的构建配置中具有样式条目,例如。 / p>

"styles": [
   "node_modules/purecss/build/pure-min.css",
   "node_modules/purecss/build/grids-responsive-min.css"
]

在一个库的组件中,我有一个使用

之类的Pure.css规则的标记。
<div class="pure-g">
  <div class="pure-u-1-3"><p>Thirds</p></div>
  <div class="pure-u-1-3"><p>Thirds</p></div>
  <div class="pure-u-1-3"><p>Thirds</p></div>
</div>

但是当我在外部项目中使用组件时,很明显,样式没有被应用。

因此,我已经将Pure.css样式文件导入了相应组件的.css文件中,例如

@import url("node_modules/purecss/build/pure-min.css");
@import url("node_modules/purecss/build/grids-responsive-min.css");

这可行,但是我希望将Pure.css库中的样式包含在整个库中,而不是仅包含一个组件。

有没有一种方法可以实现,我做了一些搜索但是找不到任何资源,是否可以配置ng-packagr以在库的构建中包括样式?

我正在使用package.json文件中定义的脚本(如

)从包含工作区的项目中构建库
"build:lib": "ng-packagr -p projects/my-library-project/package.json"

通常,我如何将第三方模块安装到库项目中,我是否通过工作区项目安装它们?

感谢您的协助。

1 个答案:

答案 0 :(得分:0)

您可以在tsconfig.json中导入第三方库

"paths": {
  "example-ng6-lib": [
    "dist/example-ng6-lib"
  ]
}