截至2019年3月10日，安圭尔放弃了对萨斯的支持。不管你在运行ng new时传递给——style什么选项，你总是会生成.scss文件。很遗憾，没有任何解释就取消了粗鲁的支持。

CSS预处理器集成 Angular CLI支持所有主要的CSS预处理程序:

要使用这些预处理器，只需将文件添加到组件的styleUrls中:

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  title = 'app works!';
}

当生成一个新项目时，你也可以定义样式文件的扩展名:

ng new sassy-project --style=sass

或者在现有项目上设置默认样式:

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

注意:@schematics/angular是angular CLI的默认原理图

样式字符串添加到@Component。styles数组必须用CSS编写，因为CLI不能对内联样式应用预处理程序。

基于angular文档 https://github.com/angular/angular-cli/wiki/stories-css-preprocessors

就像Mertcan说的，使用scss的最好方法是创建带有该选项的项目:

ng new My_New_Project --style=scss 

Angular-cli还添加了一个选项，可以在项目创建后使用以下命令更改默认的css预处理器:

ng set defaults.styleExt scss

要了解更多信息，你可以在这里查看他们的文档:

https://github.com/angular/angular-cli

告诉angular-cli默认总是使用scss

为了避免每次生成项目时都传递——style scss，你可能想要全局调整angular-cli的默认配置，使用以下命令:

ng set --global defaults.styleExt scss

请注意，某些版本的angular-cli包含读取上述全局标志的错误(见链接)。如果你的版本包含这个错误，生成你的项目:

ng new some_project_name --style=scss

对于Angular 12，更新Angular。json:

"schematics": {
   "@schematics/angular:component": {
      "style": "scss"
    }
  }

and:

"build": {
  "options": {
    ...
    "inlineStyleLanguage": "scss"
  }
}

"test": {
  "options": {
    ...
    "inlineStyleLanguage": "scss"
  }
}

设置为全局默认值

Ng设置默认值。styleExt = scss——全球