如何在Angular 2中使用SASS作为组件样式？

Question

在Angular 2中,当我们定义一个组件时,我们可以styleUrls为装饰器指定一个属性,该属性指向要应用于组件的一组样式表:

@Component({
    selector: 'the-app'
    templateUrl: 'templateFile.html',
    styleUrls: ['componentStyles.css', 'moreComponentStyles.css']
})
export class TheAppComponent {}

现在,如果我想用SASS写这些样式怎么办？

我知道我需要使用Gulp或Grunt将SCSS样式表转换为纯CSS.但这让我对如何正确地将Angular指向正确的样式表感到困惑.

我如何组织使用SASS和Gulp/Grunt以及Angular 2的工作流程？如何使用SASS编写Angular 2组件样式？

Answer 1

您可以像这样在组件中使用 .scss -

styles: [require('normalize.css'), require('./app.scss')],

看看这是否有帮助。