vue项目安装使用scss

npm安装一些包的时候，会默认安装最新版本，但过高版本的sass会导致scss编译错误

安装依赖（指定低版本安装）

npm install sass-loader@7.3.1 --save-dev
npm install node-sass@4.14.1 --save-dev

在build文件夹下的webpack.base.conf.js的rules里面添加配置

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

在vue文件中使用

<template>
    <div class="hello">111111111111</div>
</template>
...
<style lang="scss">
$color: red;
$fontColor: #fff;
.hello {
    background: $color;
    color: $fontColor;
}
</style>

最后附上卸载方法

npm uninstall sass-loader
npm uninstall node-sass