在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组件样式?
解决方法
在关注这个
wiki后,我得到了一些错误:未捕获(在承诺中):期望的’styles’是一个字符串数组,我使用这个
answer解决了.
home.component.ts:
import { Component } from '@angular/core'; @Component({ selector: 'home',template: require('./home.component.html'),styles: [ String(require('./home.component.scss')) ] }) export class HomeComponent { }
webpack.conf.js :(部分)
{ test: /\.(css|scss)$/,loaders: [ 'style','css','sass','postcss' ] },
原文地址:https://www.jb51.cc/css/215631.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。