一文学会解析sass预编译器（超全详解）

前言：首先我们先讲一下什么是sass 以及 sass 和 scss 有什么区别？和我们为什么要使用sass。

   1. sass是css的一种开发工具，是css的预处理器，css的扩展语言。

   2. 至于sass和scss有什么区别，问出这个问题首先就有点奇怪，就比如说一个人的小时候         和长大时候有什么区别，本质上还是一个人，sass版本3.0以前叫sass，版本3.0以后更          改名叫scss，所以它们本质上就是一个东西。

   3. scss扩展了css3，增加了规则、变量、混入、选择器、继承、内置函数等等特性。提高         代码的可维护性和可重用性。

一、sass的安装

   1.安装前使用node -v查看电脑上安装的node版本

   

   2.node、node-sass、sass-loader的版本需要对应，这里是node和node-sass版本对应链表

      官网地址：https://www.npmjs.com/package/node-sass

       

                        

     3.这里是基于博主的Node 14版本安装的sass-loader 和 node-sass

npm install sass-loader@7.3.1 node-sass@4.14.1 --save-dev

 二、sass的使用

  1.使用变量

      sass让人们受益的一个重要特性就是它为css引入了变量。你可以把反复使用的css属性值定义成变量，然后通过变量名来引用它们，而无需重复书写这一属性值。