Vue项目引进sass方法详解

1. sass-loader依赖于node-sass,所以要安装node-sass

cnpm install node-sass--save-dev//安装node-sass cnpm install sass-loader--save-dev//安装依赖包sass-loader cnpm install style-loader--save-dev//安装style-loader

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

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

3. 在需要用到sass的地方添加lang=scss

注: 安装sass 出现问题 运行npm run dev 报错!
1、Modele build failed: TypeError: this.getResolve is not a function at Object.loader…
这是因为当前sass的版本太高，webpack编译时出现了错误，这个时候只需要换成低版本的就行，下面说一下修改方法，很简单，如下，找到package.json文件，里面的 "sass-loader"的版本更换掉 就行了。
解决方法：
将 “sass-loader”: “^10.0.0”，更换成了 “sass-loader”: “^7.3.1”,也可以先卸载当前版本，然后安装指定的版本
卸载当前版本npm uninstall sass-loader
安装npm install sass-loader@7.3.1 --save-dev