mirror of
https://github.com/angular/angular-cli.git
synced 2025-05-18 20:02:40 +08:00
33 lines
761 B
Markdown
33 lines
761 B
Markdown
# CSS Preprocessor integration
|
|
|
|
Angular CLI supports all major CSS preprocessors:
|
|
- sass/scss ([http://sass-lang.com/](http://sass-lang.com/))
|
|
- less ([http://lesscss.org/](http://lesscss.org/))
|
|
- stylus ([http://stylus-lang.com/](http://stylus-lang.com/))
|
|
|
|
To use these preprocessors simply add the file to your component's `styleUrls`:
|
|
|
|
```javascript
|
|
@Component({
|
|
selector: 'app-root',
|
|
templateUrl: './app.component.html',
|
|
styleUrls: ['./app.component.scss']
|
|
})
|
|
export class AppComponent {
|
|
title = 'app works!';
|
|
}
|
|
```
|
|
|
|
When generating a new project you can also define which extension you want for
|
|
style files:
|
|
|
|
```bash
|
|
ng new sassy-project --style=sass
|
|
```
|
|
|
|
Or set the default style on an existing project:
|
|
|
|
```bash
|
|
ng set defaults.styleExt scss
|
|
```
|