关于sass使用中的问题

疑问一 sass和scss什么关系

答：可以简单理解为scss是sass的一个升级版本，scss比sass功能更加强大，包含了sass之前的功能，又增加了新的功能
   两者的不同，用法的不同
     ① sass主要靠缩进表示嵌套关系，scss是花括号
     ②scss功能很强大，能做运算，写函数，--嵌套，变量$color,继承@extend,混入@mixin

1.sass 和scss描述

  Sass 是一款强化的css的辅助工具，是对css的扩展，他在css的基础上增加了变量、嵌套、继承、混入、导入功能，其后缀是.sass
 scss  scss是sass3引入的新语法，其语法完全兼容css3，并且继承了sass的强大功能， 后缀名.scss

关于scss的下载以及使用的一些问题

1.npm install sass-loader --save-dev
2. npm install node-sass --save-dev

到这我以为就可以直接使用，nono,还是我太天真，报错了

image.png

我就开始搜索---搜索结果使用都在不对----大致方法
搜索到的方法1：---让在配置文件中webpack.base.conf.js ---module的rules中添加配置

{
test:/ \.scss$/,
loaders:['style','css','sass']
}

等等，让你去webpack.base.conf.js中配置
然而并没有卵用，我继续找，
通过一顿搜索---

解决方案--------------------------

直接通过 npm install sass-loader，node-sass --save-dev下载的是最高版本，

将 sass-loader版本降低到7.3.1和node-sass版本降低到4.14.1 ----就可以使用（###切记：****如果在webpack.base.conf.js中配置了，删除）

因为：新版的vue-cli 已经帮我们把sass-loader配置好了，放在until.js中

image.png

当时看到这个网页，简直了，跟我的探索路程一摸一样，感动哭了，原来不止我自己这样
参照：https://www.cnblogs.com/yjiangling/p/12768241.html