Как включить сторонние модули в библиотеку Angular, созданную с помощью CLI

Я хотел бы использовать модуль Pure.css в библиотеке Angular, созданной с помощью команды CLI generate library.

У меня есть приложение рабочей области, в котором я выполнил команду generate library для создания библиотеки. Библиотека была успешно создана, и я смог связать ее и установить в другом проекте. Однако я хотел бы использовать систему сетки из библиотеки Pure.css, в файле angular.json приложения рабочей области (тот, который содержит библиотеку), у меня есть запись стилей в конфигурации сборки проекта библиотеки, например.

"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"

И как вообще установить сторонние модули в проект библиотеки, установить ли их через проект рабочей области?

Любая помощь приветствуется, спасибо.


angular ng-packagr angular-cli-v6
person teebo    schedule 08.09.2018    source источник
comment
Плохая идея выставлять стороннюю библиотеку в вашей библиотеке. Просто добавьте эту библиотеку в проект, который использует вашу библиотеку, и укажите зависимость в файле peerDependencies библиотеки.   -  person smnbbrv    schedule 08.09.2018
comment
Хорошо, спасибо, я думаю, что понимаю, что вы имеете в виду.   -  person teebo    schedule 08.09.2018
comment
@smnbbrv .. да, но тогда внешние библиотеки будут отвечать за импорт стилей из peerDependecy?   -  person PeS    schedule 10.09.2018
comment
@PeS да, для этого и созданы одноранговые зависимости   -  person smnbbrv    schedule 10.09.2018
comment
Вот чего я боялся. Вы не можете доставить библиотеку, которая инкапсулирована и работает, просто импортируя, вы должны предоставить некоторую дополнительную конфигурацию разработчику, который использует библиотеку :(   -  person PeS    schedule 10.09.2018
comment
@smnbbrv теперь я полностью понимаю, почему вы сказали, что было плохой идеей предоставлять сторонние библиотеки в моей библиотеке, но вместо этого я должен использовать peerDependencies, тогда NPM будет использовать библиотечный package.json(peerDependency) для разрешения стороннего пакета в потребляющий проект, если потребляющий проект или другой сторонний пакет использует версию пакета, отличную от версии, требуемой моей библиотекой (NPM выдаст предупреждение, если возникнут эти конфликты, или установит версию стороннего пакета, определенную в одноранговые зависимости моей библиотеки). Спасибо еще раз.   -  person teebo    schedule 24.06.2019
comment
пожалуйста :) Это хорошо, что это помогло. У меня действительно была такая же проблема несколько лет назад, и я до сих пор плачу за это. Жизнь отстой :D   -  person smnbbrv    schedule 25.06.2019

Ответы (1)


arrow_upward
0
arrow_downward

Вы можете импортировать стороннюю библиотеку внутри tsconfig.json.

"paths": {
  "example-ng6-lib": [
    "dist/example-ng6-lib"
  ]
}
person Suresh Kumar Ariya    schedule 08.09.2018