sass是一款可编译的 css语言

所谓的可编译就是像JavaScript一样
css中也可以有 变量 if判断 for循环 函数...
提供了更加简单便捷的css语法书写形式

缺点:

浏览器不支持 sass less 等
如果需要执行 必须先 编译 为 原生 css程序,浏览器才能执行

sass 的编译方式

(1) 使用 vscode 插件编译

Easy Sass,不推荐使用,功能单一,不能满足需求

(2) node.js来编译 sass 文件

开发时使用

(3) gulp编译的同时,完成打包压缩工作

准备打包上线时使用

sass的使用

(1) sass文件的分类

.sass  不推荐使用

css语法中没有 {  }

.scss  推荐使用

与普通的css 没有太大区别,只是增加了sass语法的变量等等

(2) sass的 nodejs 编译

先下载全局作用域 sass

npm i -g sass

编译之前,先切换到相应的路径

a  单个文件的编译

sass 你要编译的sass文件名 你要编译成的css文件名

手动编译,每次sass文件内容改变,都要再次执行
而且一次只能编译一个文件

b  整个文件夹文件的编译

sass 你要编译的sass文件夹名:你要编译成的css文件夹名

手动编译,每次sass文件内容改变,都要再次执行
只会生成文件名相同的css文件

c  单个文件的监听编译

sass --watch sass文件:css文件

d  整个文件夹文件的监听编译

sass --watch sass文件夹:css文件夹

所谓监听,就是 sass文件改变,自动执行编译
编译成css文件时,自动生成的 map文件 存储编译的相关信息

一沙一世界,一花一天堂。君掌盛无边,刹那成永恒。