這篇文章是記錄的在VUE項目中SCSS的使用
vue項目上安裝SCSS和開發入門
① 使用vue-cli模板創建新項目：vue init webpack myvue
② 安裝sass 依賴包 ，在cmd界面輸入：
npm install sass-loader --save-dev
npm install node-sass --sava-dev
③ 在build文件夾下的webpack.base.conf.js的rules里面添加配置
{
test: /\.scss$/,
loaders: ['style', 'css', 'sass']
}
④ 使用scss時候在所在的style樣式標簽上添加lang=”scss”即可應用對應的語法，否則報錯
⑤ scss使用測試：如下測試修改字體顏色
<style lang="scss">
$color:red;
div {color:$color;}
</style>
我這樣做完以后，運行一下，報錯
Modele build failed: TypeError: this.getResolve is not a function at Object.loader...
這是因為當前sass的版本太高，webpack編譯時出現了錯誤，這個時候只需要換成低版本的就行，下面說一下修改方法，很簡單，如下，
找到package.json文件，里面的 "sass-loader"的版本更換掉 就行了。
我本地是將 "sass-loader": "^8.0.0"，更換成了 "sass-loader": "^7.3.1",
執行命令，重新安裝項目依賴：
npm install
然后重新 npm run dev 就完美的解決啦！