Ng set——全局默认值。styleExt=scss自ng6起已弃用。你会收到这样的信息:

Get /set已弃用，改用config命令

你应该使用:

ng config schematics.@schematics/angular:component '{ styleext: "scss"}'

如果你想要针对一个特定的项目(用你的项目名替换{project}):

ng config projects.{project}.schematics.@schematics/angular:component '{ styleext: "scss"}'

我注意到在移动到scss文件时一个非常烦人的陷阱!!在app.component.ts中，必须从简单的:styleUrls: [' app.ponent .scss']转移到styleUrls: ['./ app.ponent .scss'] (add ./)

ng在生成新项目时这样做，但在创建默认项目时似乎不这样做。如果在ng构建过程中看到resolve错误，请检查此问题。我只花了1个小时。

就像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 6项目中工作。例如，如果你得到:

Get /set已弃用，改用config命令。

npm install node-sass --save-dev

然后(确保您更改了项目名称)

ng config projects.YourPorjectName.schematics.@schematics/angular:component.styleext sass

要获得默认项目名，请使用:

ng config defaultProject

然而: 如果你把你的项目从<6迁移到angular 6，很有可能配置不会在那里。在这种情况下，你可能会得到:

无效的JSON字符:“s”在0:0

因此需要手动编辑angular。Json是必需的。

你会希望它看起来像这样(注意styleex属性):

...
"projects": {
    "Sassy": {
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "prefix": "app",
      "schematics": {
        "@schematics/angular:component": {
          "styleext": "scss"
        }
      }
...

对我来说，这似乎是一个过于复杂的模式。¯_()_/¯

你现在必须去改变你所有的css/less文件为scss和更新组件等任何引用，但你应该很好去。

博士TL; 注意:在Angular 9及以后的版本中，styleext被重命名为style Angular 9 & 9+在创建一个新项目时 对于现有的: ng图表.@schematics /角:组件。scss风格 对于Angular 2 - Angular 8: 对于一个现有的项目:ng config schematics.@schematics/angular:component。styleext scss

详细的回答

Angular 9 & 9+:

通过Angular CLI

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

直接在angular.json中:

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

对于旧版本

通过Angular CLI:

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

直接在angular.json中:

注意:查找angular-cli。Json版本大于6。对于版本6和6+，该文件已被重命名为angular.json

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

注:原来的SO答案可以在这里找到

Angular- cli是推荐的方法，也是Angular 2+社区的标准。

克里特岛与SCSS的新项目

ng new My-New-Project——style=sass

转换现有项目(CLI小于v6)

Ng设置默认值。styleExt scss

(必须手动重命名所有的。css文件，不要忘记重命名你的组件文件)

转换现有项目(CLI大于v6)

将所有CSS文件重命名为SCSS，并更新引用它们的组件。 将以下内容添加到angular的“schematics”键中。Json(通常是第11行):

“@schematics /角:组件":{ “styleext”:“萨斯” ｝