scss --- css的预处理器

scss(sass):

概念:scss是css预处理器, 世界上最成熟、最稳定、最强大的专业级CSS扩展语言, scss是一门高于CSS的语言,它能用来 清晰的、结构化地描述文件样式,有着比普通CSS更加强大的功能.,能够提供更简洁、更优雅的语法、同时提供多种功能来创建可维护和管理样式表.

其他css预处理器:sass(scss), less, Stylus, DT CSS, Switch CSS, Turbine, Switch CSS, CSS Cacheer

原理:Sass本质就是在CSS的语法的基础上增加了自定义的变量、循环、分支、函数、mixin、继承、运算等功能，让CSS编程变得异常强大. 当然浏览器是不认识Sass语法. 开发人员写完了Sass的语法文件后需要通过工具转成原始的CSS代码.

安装:
sass基于Ruby语言开发而成，因此安装sass前需要安装Rub(安装网址:https://rubyinstaller.org/downloads/)
安装完成后需测试安装有没有成功,运行CMD输入以下命令: ruby -v
gem install sass
gem install compass

编译scss:

//单文件转换命令
sass input.scss output.css
//单文件监听命令
sass --watch input.scss:output.css
//如果你有很多的sass文件的目录，你也可以告诉sass监听整个目录：
sass --watch app/sass:public/stylesheets

vscode 使用scss: