Sass 安装与使用

2018-02-28  本文已影响0人  大孩子气

1.下载ruby( 注意勾选Add Ruby executables to your PATH)
2.找到安装目录 打开Start Command Prompt with Ruby
3.淘宝镜像 安装sass

移除默认源  gem sources --remove https://rubygems.org/
添加淘宝源  gem sources -a https://ruby.taobao.org/
查看源  gem sources -l

4.通过gem安装sass

安装 --- gem install sass
升级 --- gem update sass
查看命令 --- sass -v
帮助命令 --- sass -h

5.sass有两种后缀名文件sass和scss:推荐使用scss

//文件后缀名为sass的语法
body
  background: #eee
  font-size:12px
p
  background: #0982c1

//文件后缀名为scss的语法  
body {
  background: #eee;
  font-size:12px;
}
p{
  background: #0982c1;
} 

6.命令行编译
单文件转换
sass index.scss index.css
单文件监听
sass --watch index.scss:index.css
文件夹监听
sass --watch sass/index.scss:css/index.css
7.命令行其他配置
常用的有--style,--sourcemap,--debug-info

sass --watch style.scss:style.css --style compact
sass --watch style.scss:style.css --sourcemap
sass --watch style.scss:style.css --style expanded --sourcemap
sass --watch style.scss:style.css --debug-info

--style表示解析后的css是什么格式,有四种取值分别为: nestedexpandedcompactcompressed
--sourcemap表示开启sourcemap调试。开启sourcemap调试后,会生成一个后缀名为 .css.map文件。
--debug-info表示开启debug信息,升级到3.3.0之后因为sourcemap更高级,这个debug-info就不太用了。

上一篇 下一篇

猜你喜欢

热点阅读