Как включить глобальные стили в пользовательскую угловую библиотеку - PullRequest
2 голосов
/ 04 июля 2019

У меня работает приложение Angular 7, и я пытаюсь создать библиотеку пользовательских элементов управления. У меня есть несколько глобальных стилей, которые необходимо импортировать в приложение Angular из этой библиотеки элементов управления.

Я пытаюсь добиться чего-то вроде следующего:

@import "~@angular/material/prebuilt-themes/indigo-pink.css";

в потребительском приложении, где будет использоваться эта библиотека управления. У меня есть корневая таблица стилей, которая импортирует другие миксины, как показано ниже:

root.scss

      @include list-themeable($theme);
      @include radiobutton-themeable($theme);
      @include checkbox-themeable($theme);

Мне нужно скомпилировать этот файл root.scss во время сборки библиотеки, чтобы создать файл css, который можно импортировать в потребительское приложение, где будет использоваться эта библиотека.

Я гуглил решение и наткнулся на Компиляция библиотеки CSS в Angular 6 :

  • Установите некоторые devDependencies в нашей библиотеке, чтобы связать CSS:

     ng-packagr 
     scss-bundle 
     ts-node 
    
  • Создание css-bundle.ts

  • Добавьте _theme.scss в каталог / src библиотеки, которая фактически содержит и импортирует все CSS, которые мы хотим связать.

  • Добавить скрипт пост-сборки npm для запуска css-bundle.ts:

  • Включите его в тег стиля в вашем приложении в angular.json

Есть ли другой способ сделать это ..?

Пожалуйста, помогите мне в этом.

...