项目中安装node-sass的问题

最新推荐文章于 2024-09-25 15:41:39 发布

halo1416

最新推荐文章于 2024-09-25 15:41:39 发布

阅读量5.4k

点赞数 1

分类专栏： vue 文章标签： vue node-sass npm下载node-sass慢 sass-loader下载失败

本文链接：https://blog.csdn.net/halo1416/article/details/107340608

版权

vue 专栏收录该内容

48 篇文章 5 订阅

订阅专栏

一、前言：

如果你的项目中使用了sass作为预编译，则会下载一个包：node-sass，但是这个包会下载失败。

二、产生原因

在下载node-sass 这个包时，package.json中生成的依赖记录事这样的"node-sass": "^4.9.0"，表示为安装的node-sass最低版本为4.9.0，而安装高版本就会报错。

有一种解释是这样的：npm安装node-sass时，会从github.com上下载 .node 文件。蛋由于国内网络环境的问题，这个下载时间会很差，甚至导致超时失败。

三、解决方法

3.1 安装低版本（治标不治本）

项目没有版本要去可以这么处理
指定安装低版本，如：cnpm install node-sass@4.9.0

3.2 npm 下载

3.2.1 从环境解决解决，切换淘宝源

// 局部设置
npm i node-sass --sass_binary_site=https://npm.taobao.org/mirrors/node-sass/

// 全局设置
npm config set sass_binary_site https://npm.taobao.org/mirrors/node-sass/

3.2.2 从项目配置解决，添加配置文件.npmrc

sass_binary_site=https://npm.taobao.org/mirrors/node-sass/
registry=https://registry.npm.taobao.org

3.3 yarn下载

处理yarn下载失败比npm更为复杂。需要自己手动下载包放在本地的yarn缓存中。
当我们使用yarn下载node-sass时，报错原因其实就是解析的时候出错了。

1. 查看失败原因
在使用yarn下载失败以后，查看node-modules/node-sass/vendor目录，假设里面是win32-x64-83版本，这里面就是我们需要下载的包文件，但是我们发现它是空的目录。

2. 手动下载node-sass包
我们去手动下载：下载地址
在上述地址中找到win32-x64-83版本的binding.node；既下载win32-x64-83_binding.node文件。

3. 更新Yarn本地缓存
通过命令 yarn cash dir 找到对应的yarn缓存目录

一般都是C:\Users\Administrator\AppData\Local\Yarn\Cache\v6
然后再该目录下找到 node-sass 文件，我们可以看到内部没有vendor文件（或者vendor文件为空），那么把刚才的vendor文件夹复制进来，并且将win32-x64-83_binding.node改名为binding.node放到win32-x64-83文件夹下面，然后再次去下载就可以下载成功了

参考博客：https://segmentfault.com/a/1190000018620589

文章仅为本人学习过程的一个记录，仅供参考，如有问题，欢迎指出！
对博客文章的参考，若原文章博主介意，请联系删除！请原谅