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,就是这样简单!
angular4.0使用sass的更多相关文章
- Angular4.0.0正式版发布
来源于angular4.0.0发布时的公告,译者:niithub 原文发布时间:Thursday, March 23, 2017 翻译时间:2017年3月24日 angular4.0.0正式版现在可以 ...
- Angular4.0学习笔记 从入门到实战打造在线竞拍网站学习笔记之二--路由
Angular4.0基础知识见上一篇博客 路由 简介 接下来学习路由的相关知识 本来是不准备写下去的,因为当时看视频学的时候感觉自己掌握的不错 ( 这是一个灰常不好的想法 ) ,过了一段时间才发现An ...
- Angular4.0从入门到实战打造在线竞拍网站学习笔记之三--依赖注入
Angular4.0基础知识之组件 Angular4.0基础知识之路由 依赖注入(Dependency Injection) 正常情况下,我们写的代码应该是这样子的: let product = ne ...
- Angular4.0从入门到实战打造在线竞拍网站学习笔记之四--数据绑定&管道
Angular4.0基础知识之组件 Angular4.0基础知识之路由 Angular4.0依赖注入 数据绑定 数据绑定允许你将组件控制器的属性和方法与组件的模板连接起来,大大降低了开发时的编码量. ...
- angular4.0运行在微信端的坑坑洼洼
最近的一个项目,我用ng4操刀,踩了超多的坑: 坑1:项目build后,刷新后404错误: 解决方案:<angular4.0项目build发布后,刷新页面报错404> 坑2:微信分享: 运 ...
- angular4.0微信oAuth第三方认证的正确方式
当我们的项目运行在微信端时,用到oAuth第三方认证.问题来了,在ng4中微信认证应该放在哪里呢? 开始项目的时候,我将oAuth认证放在了每个页面模版中,发现返回历史页的时候,需要返回两次. 这个问 ...
- angular4.0项目build发布后,刷新页面报错404
angular4.0项目执行npm run build后,进入页面正常显示. 但是当刷新页面时,报错404,页面未找到. 出现这个问题的原因,应该是找不到路由地址导致的,然后找到了下面的解决方案. 找 ...
- angular4.0配置同时使用localhost和本机IP访问项目
之前写过<angular4.0配置本机IP访问项目>的文章,今天再次更新一个,谢谢大家的指正. 今天的目的是:使用本机IP地址,或者localhost都可以访问项目. 第一步:找到此文件& ...
- angular4.0如何引入外部插件2:declare方案
前面有个<angular4.0如何引入外部插件1:import方案>,但是有局限,因为方案1需要用到@types这个东西. 但是并不是每一个插件都有@types,所以现在写个方案2. 拿引 ...
随机推荐
- php中trait
1.简介 自 PHP 5.4.0 起,PHP 实现了一种代码复用的方法,称为 trait. Trait 是为类似 PHP 的单继承语言而准备的一种代码复用机制.Trait 为了减少单继承语言的限制,使 ...
- 简单了解Markdown
在Github的readme.md文件的编辑中,開始渐渐的接触Markdown.如今简单系统叙述一下Markdown的语法. Markdown是一种能够使用普通文本编辑器编写的标记语言.通过类似HTM ...
- Python笔记·第七章—— IO(文件)处理
一.文件处理简介 计算机系统分为:计算机硬件,操作系统,应用程序三部分. 我们用python或其他语言编写的应用程序若想要把数据永久保存下来,必须要保存于硬盘中,这就涉及到应用程序要操作硬件,众所周知 ...
- HTTPS加密流程超详解(一)前期准备
0.前言 前一阵子想写一个HTTPS的嗅探工具,之前只是大致了解SSL/TLS协议的加密流程,真正上起手来一步一步分析发现还是有点复杂的,于是我参考了wireshark的源码以及各种RFC,弄清楚了S ...
- Redis的那些最常见面试问题
随笔:经过长达一周的奔波和面试,电话面试,回首今天终于成功的入职了,总共面试了大概10家公司,包括阿里,京东,IBM等等,京东技术过了,学历因为非统招就被pass了,阿里面了2次电话面试就没下文了,估 ...
- centos6.5 yum update 报错Couldn't resolve host 'centos.ustc.edu.cn'
异常信息 [root@localhost ~]# yum -y update Loaded plugins: fastestmirror, refresh-packagekit, security S ...
- 微信小程序路过
应该算是入门篇, 从我怎么0基础然后沿着什么方向走,遇到的什么坑,如何方向解决,不过本人接触不是很多,所以也就了解有限. 小程序的前提: 1.小程序大小不允许超过2M.(也就是本地图片,大图精图不要在 ...
- 解决iOS手势冲突问题
今天在做一个效果的时候,由于子视图和父视图都有响应的事件,子视图的事件理所当然被父视图拦截掉了,接下来就做分析解决 1. tableviewcell可以触发点击,同时tableview的父视图有点击 ...
- gcc编译相关tips
http://blog.csdn.net/benpaobagzb/article/details/51364005 静态库链接时搜索路径顺序: ld会去找GCC命令中的参数-L 再找gcc的环境变量L ...
- 怎样在Spark、Flink应用中使用Protobuf 3的包
如果在在Spark.Flink应用中使用Protobuf 3的包,因为Spark默认使用的是2.5版本的包,提交任务时,可能会报如下异常: com.google.protobuf.CodedInput ...