vue 中安装使用sass 报错遇到的问题整理

不出错的状况下，正常安装：

1.安装包：

npm install node-sass --save-dev

npm install sass-loader --save-dev

（sass-loader依赖于node-sass）

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

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

3.在APP.vue中修改style标签

<style lang="scss">

4.启动npm run dev

若是一切顺利，恭喜你，若是没成功，别慌

出错状况：

a.在第一步安装sass-loader和node-sass时报错，我装了不少次，sass-loader没问题，主要是node-sass装不上，多是网络缘由没法下载，能够使用淘宝镜像来安装：

$ npm install -g cnpm --registry=https://registry.npm.taobao.org  （安装淘宝镜像）

$ cnpm install node-sass  --save （使用淘宝镜像安装node-sass）

OK，若是没问题了的话，恭喜，能够回到2.3.4来使用sass了

b.像我这种运气差到用淘宝镜像依然装不上的状况怎么办？不慌

安装失败之后就不会再下载了，因此先把安装失败遗留的东西删掉：

npm uninstall node-sass && npm i node-sass --sass_binary_site=https://npm.taobao.org/mirrors/node-sass/

 

而后去官网选择版本号、系统环境下载node-sass文件到本地，后缀是.node文件，经过本地来安装：

下载地址：https://github.com/sass/node-sass/releases

 

下载完之后，打开文件夹，复制地址，经过git本地安装：

npm i node-sass --sass_binary_path=/Users/win32-x64-64_binding.node

红色部分是你node-sass的本地地址

安装号之后，继续2.3.4，若是能够运行起来，恭喜，你已经能够用sass了！

c.什么，像我这种运气差的人，还报错是么？不慌，看看错误代码是什么：

 

 

意思是sass-loader依赖于V4以上的node-sass版本，可是找不到，而后打开package.json发现是由于node-sass被安装到了生产环境依赖模块里面，换到开发环境：

npm i node-sass -D

 OK了，问题解决，但愿可以帮到你！