第一步： 下載依賴

npm install node-sass --save-dev
npm install style-loader --save-dev

第二步：

在build文件夾的webpack.base.conf.js文件的rules里添加

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

第三步：在需要用到scss的vue組件里使用

<style scoped lang='scss'>

在這里插入圖片描述

如果運(yùn)行出現(xiàn)如下錯(cuò)誤

image.png

說明當(dāng)前sass-loader版本太高，webpack不能編譯，要修改sass-loader版本。
一種方法是在package.json文件中找到sass-loader直接修改（我是從八點(diǎn)幾降到七點(diǎn)幾的）

在這里插入圖片描述

另一種方法是

npm uninstall sass-loader
npm install sass-loader@7.3.1 --save-dev