使用ng-packagr构建库时包括资产

Question

有人能给出一个提示，从哪里开始使用ng-packagr将图像和css文件包含到角库中？

Answer 1

关于这个问题，这里有一个正式的问题。实际上，将图像之类的内容包含到库中非常简单:您可以在ng-packagr完成任务后手动将它们复制到dist文件夹中。

但是，在将使用您的库的项目中自动提取这些文件要困难得多。在上面引用的问题中，BenjaminDobler建议将以下映射添加到任何使用者项目的.angular-cli.json文件中：

{ "glob": "**/*", "input": "../node_modules/my-lib/assets", "output": "./assets/my-lib/" }

不过，我觉得这更像是一个NPM问题，也有一些普通的NPM解决方案，比如pkg-资产和npm-资产。

Answer 2

这是一个旧线程，但在2020年2月仍在使用最新选项进行更新。

对于ng-packagr ^9.0.1版本，您可以使用内置的“复制资产”来完成此操作。

{
  "ngPackage": {
    "assets": [
      "CHANGELOG.md",
      "./styles/**/*.theme.scss"
    ],
    "lib": {
      ...
    }
  }
}

https://github.com/ng-packagr/ng-packagr/blob/master/docs/copy-assets.md

这帮助我删除了postpackage脚本。

添加我的实际ng-package.json以造福他人。我希望将“资产”文件夹及其所有内容复制到库中，并与其一起发布。

{
  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
  "dest": "../../dist/common",
  "assets": [
    "assets"
  ],
  "lib": {
    "entryFile": "src/public-api.ts",
    "umdModuleIds": {
      "common": "common"
    }
  }
}

资产文件夹位于库根目录中。这有助于复制整个资产文件夹及其内的内容，并将其添加到库中，以便您可以将其作为@include "@node_modules/your-library/assets/styles/main.scss“使用。

Answer 3

它可以在Linux上使用post*脚本实现自动化。

"scripts": {
    "package": "ng-packagr -p ng-package.json",
    "postpackage": "cp -R YOUR_ASSETS_FOLDER dist/YOUR_ASSETS_FOLDER && tar -cvzf dist.tgz -C dist .",
    "release": "npm publish dist"
}