Вложение Angular 6 SASS не работает на уровне модуля

Question

Я работаю над угловым 6 гибридным проектом. Обычно мы добавляем зависимые от css файлы в angular.json в массиве styles.

"styles": [
     "src/styles.scss", 
     "./node_modules/css file"
 ],

Поскольку у меня возникли некоторые конфликты стилей, я попытался вложить файлы css node_modules в styles.scss , используя родительский класс.

.parent-class {
  @import '~bootstrap/dist/css/bootstrap.css';
  @import "~/node_modules/xyz/styles/xyz.css";
  @import "~@aa/abc/styles/theme.css";
}

Приведенное выше решение, предложенное sass , здесь не сработает, любая идея о вложении глобально при использовании angular 6 для сборки приложения.

Answer 1

Вы можете добавить это ниже "стили" в вашем файле angular.json

        "stylePreprocessorOptions": {
          "includePaths": [
            "path to your sass files here such as src/scss"
          ]
        }

, затем вы можете импортировать их в любой файл sass следующим образом:

@import 'xyz.scss'; 

и т.д.