疑問(wèn)一 sass和scss什么關(guān)系

答：可以簡(jiǎn)單理解為scss是sass的一個(gè)升級(jí)版本，scss比sass功能更加強(qiáng)大，包含了sass之前的功能，又增加了新的功能
   兩者的不同，用法的不同
     ① sass主要靠縮進(jìn)表示嵌套關(guān)系，scss是花括號(hào)
     ②scss功能很強(qiáng)大，能做運(yùn)算，寫函數(shù)，--嵌套，變量$color,繼承@extend,混入@mixin

1.sass 和scss描述

  Sass 是一款強(qiáng)化的css的輔助工具，是對(duì)css的擴(kuò)展，他在css的基礎(chǔ)上增加了變量、嵌套、繼承、混入、導(dǎo)入功能，其后綴是.sass
 scss  scss是sass3引入的新語(yǔ)法，其語(yǔ)法完全兼容css3，并且繼承了sass的強(qiáng)大功能， 后綴名.scss

關(guān)于scss的下載以及使用的一些問(wèn)題

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

到這我以為就可以直接使用，nono,還是我太天真，報(bào)錯(cuò)了

image.png

我就開始搜索---搜索結(jié)果使用都在不對(duì)----大致方法
搜索到的方法1：---讓在配置文件中webpack.base.conf.js ---module的rules中添加配置

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

等等，讓你去webpack.base.conf.js中配置
然而并沒(méi)有卵用，我繼續(xù)找，
通過(guò)一頓搜索---

解決方案--------------------------

直接通過(guò) npm install sass-loader，node-sass --save-dev下載的是最高版本，

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

因?yàn)椋盒掳娴膙ue-cli 已經(jīng)幫我們把sass-loader配置好了，放在until.js中

image.png

當(dāng)時(shí)看到這個(gè)網(wǎng)頁(yè)，簡(jiǎn)直了，跟我的探索路程一摸一樣，感動(dòng)哭了，原來(lái)不止我自己這樣
參照：https://www.cnblogs.com/yjiangling/p/12768241.html