vue中使用scss(sass)踩过的坑

1.首先是vue项目中使用scss，网上教程比较多也很全面，简单扒一些

    安装sass 依赖包 ，在cmd界面输入：

npminstallsass-loader--save-dev

npminstallnode-sass--sava-dev

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

{

test: /\.scss$/,

loaders: ['style','css','sass']

}

3.使用scss时候在所在的style样式标签上添加lang=”scss”即可应用对应的语法，否则报错

---------------------------------------------------------分割线-------------------------------------------------

按照正常方法，上面这几步完成后重新npm run dev  就可以运行查，写几句scss样式就可以看到效果，但是我在使用时报错

原因主要是我们sass-loader的版本太高，导致webpack编译时出错。

解决：打开我们的package.json，修改sass-loader的版本为7.3.1

执行命令，重新安装项目依赖

$ npm install

然后，启动项目

$ npm run dev

项目启动成功，编译报错问题解决