Why is my Angular CLI Creating CSS instead of SCSS Files?

Question

Prior to updating to Angular 9, my project was configured to use SCSS when the ng generate command was run, and indeed it did.

Much to my dismay, after running my first ng g c on Angular 9, it added a css file rather than a scss file.

The accepted answer to this does not appear to work any longer. My angular.json includes the following (as it has for the past two years):

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

How do I fix this?

`styleext` is now deprecated, you should use `style` instead. — C.OG, Apr 12 '20 at 16:09

score 12 · Answer 1 · answered Apr 12 '20 at 16:06

12

Please try like this.

In angular.json, set "schematics" as below to default scss when generate new component

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

answered Apr 12 '20 at 16:06

Sayooj V R

2,255
2
11
23

score 6 · Answer 2 · answered Jun 12 '21 at 01:17

I recently upgraded my Angular CLI to v12 and generated a new project. I opted to generate scss files for new components. After creating a component, I saw that css files were being generated, not scss files. I ran the below command and now when I generate a new component, the scss file is created and not css.

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

Why is my Angular CLI Creating CSS instead of SCSS Files?

2 Answers2