angular4.0使用sass

一、为什么选择sass
为了更好的管理代码,我们需要可以定义变量,同时可以使用函数的样式工具,比如定义公用color、bg。显然css无法满足需求。
现在市面上常用的是sass、less。经过比较,我选择sass,因为sass更加接近css的写法。

二、配置sass
1、利用npm工具安装sass依赖和loader

npm install node-sass --save-dev
npm install sass-loader --save-dev

2、修改.angular-cli.json文件

"styles": [
    "styles.scss"
],
"defaults":{
    "styleExt": "scss",
    "component": {}
}

注意:不用怀疑是不是写错了,不是sass,就是改成scss

3、将项目中已经存在的.css文件改成.scss【项目会自动修改的】

4、新建的component项目会直接生成.scss文件

ok,就是这样简单!

posted @ 2017-10-19 14:23  狂奔的小马扎  阅读(1912)  评论(0编辑  收藏  举报