解决方法
node-sass 是 ruby 时代遗留下来的“宝贝”,依赖各种远古编译环境,如 Python2.7、G++等,而现在我们再去装会碰到各种报错。
实际上,我们用 sass 替代 node-sass 即可。dart-sass 兼容 node-sass 的 API,而且安装过程无需下载二进制文件,这样大家就不需要安装 node-sass 了。
package.json
{
"sass": "^1.68.0",
}
编译不会报错,但是会有一些过时写法的警告。
Deprecation Warning: $weight: Passing a number without unit % (0) is deprecated.
To preserve current behavior: $weight * 1%
More info: https://sass-lang.***/d/function-units
╷
42 │ color: mix($--tag-su***ess-color, $--color-white, $fontColorWeight);
node-sass 安装过程分析
首先了解一下 node-sass
安装的过程:
-
npm
拉下node-sass
包; -
根据
node
版本和node-sass
版本拉取对应的binding.node
编译器,原因是sass
的编译语言比较特殊,需要下载对应版本的编译器才能编译;(node scripts/install.js
阶段) -
如果能拉下
binding.node
就【安装成功】;如果找不到对应的
binding.node
包,即失败,然后就会尝试本地编译。
失败原因分析
一、网络不稳定
首先要知道的是,安装 node-sass
时在 node scripts/install.js
这个阶段会从 github.*** 上下载一个 .node
文件,大部分安装不成功的原因都源自这里,因为 GitHub Releases 里的文件都托管在 s3.amazonaws.***
上面,而这个网址在国内总是"网络不稳定",所以我们需要通过第三方服务器下载这个文件。
二、本地编译没有Python环境
三、node-sass版本与当前Node版本不匹配
因node版本与node-sass版本不匹配导致 binding.node
拉不下来,无法编译。
node-sass
版本的兼容性不好,老项目中依赖的 node-sass
很可能已经不兼容新的 node
版本,对应版本兼容参考如下官方仓库https://link.juejin.***?target=https%3A%2F%2Fwww.npmjs.***%2Fpackage%2Fnode-sass
NodeJS | Supported node-sass version | Node Module |
---|---|---|
Node 15 | 5.0+ | 88 |
Node 14 | 4.14+ | 83 |
Node 13 | 4.13+, <5.0 | 79 |
Node 12 | 4.12+ | 72 |
Node 11 | 4.10+, <5.0 | 67 |
Node 10 | 4.9+ | 64 |
Node 8 | 4.5.3+, <5.0 | 57 |
Node <8 | <5.0 | <57 |
比如我在 Node 8
的环境下安装 node-sass@3.13.1
, 安装的时候就会出现找不到对应的 binding.node
而报错,如下:
$ npm install --save-dev node-sass
> node-sass@3.13.1 install D:\WorkSpace\mumble-next-ng\node_modules\gulp-sass\node_modules\node-sass
> node scripts/install.js
Downloading binary from http://npm.taobao.org/mirrors/node-sass/v3.13.1/win32-x64-57_binding.node
Cannot download "http://npm.taobao.org/mirrors/node-sass/v3.13.1/win32-x64-57_binding.node":
HTTP error 404 OK
四、没有清理缓存
每次装包失败报错后记得都要 npm uninstall xxx
清除装包错误留下的缓存。
比如 npm i -D node-sass
报错了,就要执行一遍 npm uninstall node-sass
,然后再重新安装。