vue中使用sass出现的小问题

纯菜~

创建一个vue的小项目。搜其它文章即可。
在这个项目中我使用sass来写样式。项目名称为“novice-niu”
在node和vue-cli都安装后的常规步骤 ↓

vue init webpack novice-niu

出现如下 ↓

当中三个需要手动选择的选项默认都是Y。这个原理我说不清楚。。。。其实都选默认Y不会对项目本身产生什么影响，只是在编写代码时，会报巨多错。。到时候满屏的黄底黑字是真的很崩溃。
所以个人建议这三个都手动选n。
其它的直接Enter即可。

项目已搭建好。
我一般喜欢用sass来写样式。
常规步骤为 ↓

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

随后在 build 文件夹中的 webpack.base.conf.js 文件中的rules中添加 ↓

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

当把lang的格式改为scss时，就卡住了。。。。小黑窗报错 ↓

经过搜索发现，这个问题的出现是因为webpack的版本和loader的版本不匹配。
这时，需要将sass-loader和node-sass的版本进行降级。

之前直接安装的版本为

先卸载 ↓

npm uninstall node-sass sass-loader

重新安装 ↓

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

tada~~
就可以正常写sass啦~

呢个啥。。这只是我遇到问题的全过程，其实下次安装时直接用这俩版本就成哈哈哈哈哈哈