@angular/cli: 1.4.1 Angular Generate Component but

Question

$npm install -g @angular/cli
$ng new angular --routing --style=sass
$ng g c home
 "apps": [
    {
      "styles": [
           "styles.sass"
      ],
    }

"defaults": {
    "styleExt": "sass",
    "component": {
    }
  }

I want to sass style in angular, I use angular cli, I try to generate component it returns with style with prefix css. May you help me to fixing that? Thanks in advance for your answer.

Answer 1

Here is my defaults that works :

"defaults": {
  "styleExt": "scss",
  "prefixInterfaces": false,
  "inline": {
    "style": false,
    "template": false
  },
  "spec": {
    "class": false,
    "component": true,
    "directive": true,
    "module": false,
    "pipe": true,
    "service": true
  }
}

Otherwise, you can just rename it.

Answer 2

To override the default style, you can use the option --style [css|scss|sass]:

ng g c home --style=css

Answer 3

I just migrated from @angular/cli@1.0.3 to @angular/cli@1.4.2 and I am facing the same issue. Turns out it's due to a bug introduced in v1.4.1 so we can only wait for a new angular-cli release that will fix this bug. In v1.4.1 also the apps.prefix is ignored but this was fixed in v1.4.2.

In the mean time, the workaround provided by @Derlin can be used.

github issues on this topic:

• https://github.com/angular/angular-cli/issues/7624
• https://github.com/angular/angular-cli/issues/7682
• https://github.com/angular/angular-cli/issues/7644
• https://github.com/angular/angular-cli/issues/7647
• https://github.com/angular/angular-cli/issues/7522

update:

The issue is fixed in @angular/cli@1.4.3. Check this release note.

@angular/cli: Generating component considers default style extension for project now