第一次在vue项目中使用scss

1.vue-cli初始化一个vue项目

2.安装 node-sass和sass-loader

• npm install sass-loader --save-dev

• npm install node-sass --save-dev

3.build文件夹中打开webpack.config.js文件，配置rules

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

4.接下来就可以正常在项目中使用scss啦

<style lang="scss">
    .hello{
      h2{
        color: pink;
      }
    }
</style>

5.若以上都配置完成，运行项目依旧报错，则在package.json文件检查sass-loader版本，可能是版本过高导致，只需要把版本号手动改成7.3.1，删除node_modules文件夹，重新npm install ，之后重新运行项目即可。

"sass-loader": "^7.3.1",