Можем ли мы использовать разные языки CSS / препроцессоры для разных компонентов в Angular Project

Question

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

Так что можно использовать разные языки стилей для разных компонентов в угловом проекте.

Answer 1

Да, вы можете создать параметры компонента

вы можете сделать это, добавив --styleext=[file extension] примерно так: ng g c test --styleext=scss вы можете сделать это для каждого сгенерированного вами компонента, просто укажите --styleext option с препроцессором, который вы хотите использовать.

Answer 2

Это будет работать. Вы можете использовать sass / scss, less и стилус .

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

less-example.component.ts

@Component({
  selector: 'less-example',
  styleUrls: [
    './less-example.less'
  ],
  templateUrl: './less-example.component.html'
})
export class LessExample {

}

less-example.less

@color: yellow;

h1 {
  color: @color;
}

scss-example.component.ts

import {Component} from '@angular/core';

@Component({
  selector: 'scss-example',
  templateUrl: './scss-example.component.html',
  styleUrls: [
    './scss-example.scss'
  ]
})
export class ScssExample {

}

scss-example.scss

  $color: green;

  h1 {
    color: $color;
  }

Вы можете увидеть это в действии здесь