Использование Sass (Scss) и Less в проекте Angular 7+

Question

Создать проект и указать препроцессор CSS просто

ng new my-app --style=scss
          ... --style=sass
          ... --style=less

Задать значение по умолчанию для существующего проекта тоже

ng config schematics.@schematics/angular:component.styleext scss
                                                        ... sass
                                                        ... less

Но что, если я хочу использовать оба Sassи Less?
Возможно ли это?

Я хотел бы интегрировать как Ng-zorro, который использует Less, так и Clarity, который использует Sass для настройки.

Answer 1

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

ng g component test

Тогда у компонента будет файл стилей с настроенным расширением.

В любом случае, он делаетне означает, что вы не можете использовать оба.

Просто измените расширение сгенерированного файла на .less и измените ссылку в компоненте.

styleUrls: ['./test.component.less'],

или даже оставьте оба файла:

styleUrls: ['./test.component.less', './test.component.scss'],

Итак, теперь у вас есть один из ваших файлов стилей less.

В конце дня вы можете смешать все возможные CSS-диалекты в вашем проекте.