Hi, for those who are using Angular 9, this works on my project.

On our angular.json file do this:

To fix it, open angular.json and search for styleext (it’s in the schematics section). Rename styleext to style.

"schematics": {
    "@schematics/angular:component": {
      "style": "scss" // Changed from styleext to style
    }
  }

Explanation: This name has changed from styleext in version 8 to style in version 9 of Angular. However, the ng update command did not take account of this.

Taken from: https://stackoverflow.com/questions/60225919/after-update-from-angular-8-to-angular-9-ng-generate-component-generates-a-c

Hi, for those who are using Angular 9, this works on my project.

On our angular.json file do this:

To fix it, open angular.json and search for styleext (it’s in the schematics section). Rename styleext to style.

"schematics": {
    "@schematics/angular:component": {
      "style": "scss" // Changed from styleext to style
    }
  }

Explanation: This name has changed from styleext in version 8 to style in version 9 of Angular. However, the ng update command did not take account of this.

Taken from: https://stackoverflow.com/questions/60225919/after-update-from-angular-8-to-angular-9-ng-generate-component-generates-a-c

Thank you, bro ! Finally made it for me

@gkamperis thanks for your solution! I had to fix the command to apply to the right schematics package: ng config schematics.@nrwl/schematics:component.styleext scss

The top level schematic doesn’t work for me, neither the project level one. It keeps creating the *.component.css 😦 I updated @nrwl/schematics 6.1.0 and no joy either.

Add a configuration on top level your angular.json It is looks like

This seems like a duplicate of https://github.com/nrwl/nx/issues/158

Looks like Nx is not using the defaults set for angular schematics.

(Angular v6) I.e. ng config schematics.@schematics/angular:component.styleext scss

will set your angular schematics defaults but NOT the nx schematics.

you need to do this: ng config schematics.@nrwl/schematics:component.styleext scss

then the components get the proper extension.

ideally nx should be looking at the @angular ones and using them. if not then on migration of a project the values should be copied over and some documentation on this would not hurt either way.

@matheo @gkamperis thanks to you both!

Hybrid answer for multiple settings if you don’t want to use the CLI is to add them to the bottom of angular.json under the @nrwl/schematics rather than @schematics…I put them directly underneath defaultProject

  "schematics": {
    "@nrwl/schematics:component": {
      "styleext": "scss",
      "spec": true,
      "flat": true,
      "changeDetection": "OnPush",
      "prefix": "repo-name"
    }
  }

this is much needed now. is there a command to alter update or add to the default NX schematics collection?

@elishnevsky it can probably be closed. I believe the schematics setup solved the issue.

FYI, there is an issue opened for this problem in the angular-cli github 11045