Как мне объявить / включить импортированную папку scss в мою библиотеку, чтобы я мог вызвать @import ее в файлах scss моего приложения?

Цель:

Я пытаюсь включить путь из моей библиотеки, чтобы я мог использовать оператор @import для включения файлов scss в свое приложение следующим образом:

@import "some-scss-in-my-lib"

Эта проблема:

К сожалению, каждый раз, когда я пытаюсь обслужить свое приложение, я получаю следующую ошибку компилятора:

SassError: Can't find stylesheet to import.

Что я уже пробовал:

  • Поиск в Stackoverflow принес мне эта ветка, в которой описывается та же проблема, с которой я столкнулся сейчас. И я попытался включить путь в свойство styleIncludePaths точно так же, как предлагал Zainu, но при попытке обслужить приложение я ' Мы столкнулись с точной проблемой, описанной в разделе Проблема выше.

  • Я попытался установить свойство stylePreprocessorOptions, например GreatHawkeye в первом сообщении, и стало возможно @import scss-файл после использования ng build, но я не могу понять, как и почему это работает для stylePreprocessorOptions, но не для styleIncludePaths?

  • Я также попытался выполнить поиск в Google, который привел меня к теме Невозможно получить стили, объединенные с использованием опции styleIncludePaths, где я нашел ответ от Алана Агуиса, но, к сожалению, не было реальное объяснение, для чего действительно нужен styleIncludePaths. Единственное, что сказал Алан Агуис:

это потому, что styleIncludePaths имеет отступ для чего-то другого.

Но, как уже было сказано, он не сказал, что такое styleIncludePaths, что еще больше смутило меня.

Я также попытался найти ng-packagr страницу github с документацией по Добавить пути включения стиля на Тема Как использовать styleIncludePaths, но результат все еще был то же самое, и я не мог найти четкого ответа на свою проблему.

Вопросы по этой проблеме:

  1. Когда используется styleIncludePaths в ng-package.json? Он используется только для опубликованных пакетов?

  2. Когда используется stylePreprocessorOptions в angular.json? Используется ли он для версии dist только после запуска ng build?

  3. В чем вообще разница между styleIncludePaths из ng-package.json и stylePreprocessorOptions из angular.json?

  4. Как мне объявить / включить импортированную папку scss в мою библиотеку, чтобы я мог вызвать @import ее в файлах scss моего приложения?

Я почти уверен, что ошибаюсь в своих предложениях, но хотел бы знать, что происходит и как решить мою проблему.

Любая помощь в этом, как всегда, приветствуется! ????????


person Fy Z1K    schedule 17.08.2020    source источник


Ответы (1)


Как указано в ответе на github, цитирую alan-agius4:

Пути включения используются процессорами CSS во время сборки библиотеки для разрешения импорта при обработке файлов scss / less / stylus. В ваших поставляемых необработанных файлах scss эти пути должны быть включены на уровне приложения, а не на уровне библиотеки, потому что такие файлы будут обрабатываться не конвейером сборки библиотеки, а приложением. Они просто копируются как статические файлы. Если вы не хотите включать такие пути на уровне приложения, вы можете использовать синтаксис импорта тильды в webpack ex:

@import "~/my-lib/scss/mixins”.

Примечание: специфические функции webpack официально не поддерживаются командой разработчиков Angular и могут выйти из строя без предупреждения.

person Fy Z1K    schedule 24.08.2020