Включите ресурсы при создании библиотеки с помощью ng-packagr

Официальная проблема для этого вопроса находится здесь. На самом деле очень просто включать изображения и тому подобное в вашу библиотеку: вы можете просто скопировать их в папку dist вручную после того, как ng-packagr сделает свое дело.

Однако сложнее автоматизировать извлечение этих файлов в проектах, которые будут использовать вашу библиотеку. В упомянутой выше проблеме BenjaminDobler предлагает добавить следующее сопоставление в .angular-cli.json файл любого потребительского проекта:

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

Я считаю, что это скорее проблема NPM, и для нее также есть простые решения NPM, такие как pkg -assets и npm-assets.

Это старая ветка, но она все еще обновляется последними опциями в феврале 2020 г.

В версии 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

Это помогло мне удалить сценарии cp 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"

Это можно автоматизировать в 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"
}

У меня также возникла такая же проблема при упаковке с помощью ngPackagr. Поэтому я написал свой собственный небольшой скрипт узла, чтобы вручную скопировать их в папку dist.

npm установочный гаечный ключ

создать новый файл js в корневом каталоге assets-copy.js

var wrench = require("wrench"),
  util = require("util");

var source = "./src/assets";
var target = "./dist/src/assets";

wrench.copyDirSyncRecursive(source, target, {
  forceDelete: true
});

console.log("Asset files successfully copied!");

добавьте скрипт сборки в package.json, как показано ниже, я назвал его manual: assets-copy

  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "packagr": "ng-packagr -p ng-package.json",
    "assets-copy": "node assets-copy.js"
  }

После того, как вы запустите

npm запустить packagr

Также запустим наш скрипт

Руководство по запуску npm: активы-копия

Он скопирует их в папку dist вручную.

Попробуйте использовать "postbuild". Меня устраивает.

на package.json

...
"scripts": {
    ...
    "build": "ng build",
    "postbuild": "cp -R projects/mylib/src/assets dist/mylib/assets",
...

ВАЖНО ... когда для выполнения сборки используются:

/> npm run build

Тогда «постбилд» будет выполнен автоматически. Он не будет выполняться, если вы используете только «ng build».