Angular-cli app generates with a default ```.css``` file extensions.

However there are options to generate apps with a different stylesheet, ```.scss```, ```.sass``` and ```.less```.

And you can also change from ```.css``` to any other extension on an existing application.

How to Generate an Angular-cli app with a ```.scss```, ```.sass``` or ```.less``` stylesheet

Creating a new project with sass is easy. All you need is the ```angular-cli --stlye flag```.

ng new my-app --style=scss 

The ```--style``` flag can be set with any of the below extensions.

--style=scss --style=sass --style=less

How to convert an existing angular-cli ```.css``` stylesheet app to sass

If your existing app is using the default angular-cli .css, or any other --style extension and you have decided to move to new styling stylesheet, all you need to do is ask Angular to start processing your intended styling stylesheet with the following command:

ng set defaults.styleExt scss

From now on, Angular-cli will start processing your application with ```.scss``` stylesheet files.

Well, unfortunately that's not all of it. Angular-cli won't convert your already ```.css``` files to ```.scss``` files.

You've to go ahead and do that yourself manually. :)