Using SCSS/Sass as default style sheet in Angular 6+ (styleExt)

问题:

Apparently the way to declare the default stylesheet extension changed from Angular 6 onwards. The styleExt property in the angular-cli.json is not recognised any longer.

For new projects this can be set with an option on the CLI --style=sass on the new command.

However, how do you change this for exsting projects that I migrate from Angular <5 or if you forgot to do this during project creation?

This question is meant to be strictly related to the breaking changes by the version 5 to 6 of Angular.

回答1:

The position on which this is set changed in the angular.json. There are 2 ways to set this option now.

Via the Angular CLI:

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

Directly in the angular.json:

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

回答2:

For exsting projects, try the command bellow

ng set defaults.styleExt scss 

文章来源: Using SCSS/Sass as default style sheet in Angular 6+ (styleExt)