ng generate component does not recognize global styles, outputs CSS file

[craig-o-curtis]

### Bug Report or Feature Request (mark with an `x`) ``` - [x ] bug report -> please search issues before submitting - [ ] feature request ```

Versions.

macOS Sierra 10.12.6
Node v6.10.2
npm 5.4.2

@angular/cli: 1.4.2
node: 6.10.2
os: darwin x64
@angular/animations: 4.4.1
@angular/common: 4.4.1
@angular/compiler: 4.4.1
@angular/core: 4.4.1
@angular/forms: 4.4.1
@angular/http: 4.4.1
@angular/platform-browser: 4.4.1
@angular/platform-browser-dynamic: 4.4.1
@angular/router: 4.4.1
@angular/cli: 1.4.2
@angular/compiler-cli: 4.4.1
@angular/language-service: 4.4.1
typescript: 2.3.4

Repro steps.

Generate a new project:
ng g new myapp --routing --style scss

Confirm .angular-cli.json defaults > styleExt is scss

Generate a module:
ng g m main -m app --routing

Generate a component: // BUG HERE
ng g c main // outputs .css file, not .scss

Re-set styleExt with command // futile
ng set defaults.styleExt scss

Regenerate new module and component still has .css extension.

The log given by the failure.

No log from failure. The output style file is .css instead of .scss

Work-around is to specify style=scss in component generating step to correct.
ng g c main -m app --style=scss

Desired functionality.

Previous versions of Angular-CLI automatically output the correct scss or other style extension

file.
Should output style file specified in .angular-cli.json

Mention any other details that might be useful.

[chekyassine]

Same here
@angular/cli: 1.4.2
node: 8.5.0
os: win32 x64
@angular/animations: 4.4.1
@angular/common: 4.4.1
@angular/compiler: 4.4.1
@angular/core: 4.4.1
@angular/forms: 4.4.1
@angular/http: 4.4.1
@angular/platform-browser: 4.4.1
@angular/platform-browser-dynamic: 4.4.1
@angular/router: 4.4.1
@angular/cli: 1.4.2
@angular/compiler-cli: 4.4.1
@angular/language-service: 4.4.1
typescript: 2.3.4

[muffinrecon]

This is happening to me as well:

"@angular/animations": "^4.3.6",
"@angular/common": "^4.3.6",
"@angular/core": "^4.3.6",
"@angular/forms": "^4.3.6",
"@angular/http": "^4.3.6",
"@angular/platform-browser": "^4.3.6",
"@angular/platform-browser-dynamic": "^4.3.6",
"@angular/platform-server": "^4.3.6",
"@angular/router": "^4.3.6",
"@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.5",
"@swimlane/ngx-charts": "^6.0.0",
"angular2-moment": "^1.5.0",
"angularfire2": "^4.0.0-rc.2",
"bootstrap": "^4.0.0-beta",
"core-js": "^2.4.1",
"d3": "^4.9.1",
"firebase": "^4.3.1",
"font-awesome": "^4.7.0",
"jquery": "^3.2.1",
"ng2-smart-table": "^1.2.1",
"ngx-clipboard": "^8.0.4",
"ngx-toastr": "^5.3.0",
"popper.js": "^1.11.1",
"rxjs": "^5.4.3",
"spinkit": "^1.2.5",
"zone.js": "^0.8.17"

[yfain]

I also ran into it in 1.4.0. I had a project that was initially generated to use css styles, then updated .angular-cli.json to use scss, but the ng g c command still generates .css files.

[aricyu]

I also ran into it in 1.4.2.

[ochaminho]

It has happened to me as well on 1.4.2.

I'm using Ubuntu 17.04 x64 if it provides any help.

What I did to manage using stylus on every component was to add --style styl on each one. i.e:
ng generate component <component-name> --style styl

It's not quite pretty, but it manages to solve the issue somehow.

[AhsanAyaz]

Duplicate of #7624, #7644, #7647, #7708 & #7522

[Brocco]

Closing as a duplicate of the issues listed above.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}