1、GUI界面编译工具
① Koala
② Compass.app
③ Scout
④ CodeKit
⑤ Prepros
2、命令编译
sass <要编译的Sass文件路径> : <要输出CSS文件路径>
缺点:只能一次性编译，每次保存“.scss”文件之后，都得重新执行命令。
优点: 编译 Sass 时，开启“watch”功能，这样只要你的代码进行修改，都能自动监测到代码的变化，并且给你直接编译出来
sass --watch <要编译的Sass文件路径> : <要输出CSS文件路径>
3. 不同样式风格的输出方法
在编译的时候带上参数“ --style nested”:
sass --watch <要编译的Sass文件路径> : <要输出CSS文件路径> --style nested
① 嵌套输出方式 nested
nested.jpg
② 展开输出方式 expanded
expanded.jpg
③ 紧凑输出方式 compact
compact.jpg
④ 压缩输出方式 compressed
compressed.jpg
4. Sass的调试
在编译的时候添加**“--sourcemap” ** 参数，即可在浏览器中直接调试 Sass 文件。
sass --watch --scss --sourcemap style.scss:style.css
网友评论