安裝node-sass失敗原因及解決辦法彙總

喆星高照發表於2024-05-21

node-sass 安裝過程

  1. npm 拉下 node-sass包;
  2. 根據node版本和node-sass版本拉取對應的binding.node編譯器,原因是sass的編譯語言比較特殊,需要下載對應版本的編譯器才能編譯;(node scripts/install.js 階段)
  3. 如果能拉下binding.node就【安裝成功】; 如果找不到對應的binding.node包,即失敗,然後就會嘗試本地編譯。

可能失敗的原因

一、網路不穩定

首先要知道的是,安裝 node-sass 時在 node scripts/install.js 這個階段會從 github.com 上下載一個 .node 檔案,大部分安裝不成功的原因都源自這裡,因為 GitHub Releases 裡的檔案都託管在 s3.amazonaws.com 上面,而這個網址在國內總是"網路不穩定",所以我們需要透過第三方伺服器下載這個檔案。

解決辦法

1. 使用淘寶映象
npm set sass_binary_site http://cdn.npm.taobao.org/dist/node-sass

然後重新執行 npm i node-sass 即可完成安裝。

2. 使用梯子

假設你的梯子在你本地機器上開啟了一個第三方伺服器 127.0.0.1:1080,那麼只需按照下面的方法配置一下就能正常安裝 node-sass 了(如果你開啟的是 PAC 模式而不是全域性模式,那還需要將 s3.amazonaws.com 加入 PAC 列表):

npm config set proxy http://127.0.0.1:1080
npm i node-sass

# 下載完成後刪除 http 代理
npm config delete proxy
3. 本地指定.node檔案

比如我們在安裝 node-sass 的時候可以發現它需要下載具體版本對應的 .node 檔案:

$ npm install --save-dev node-sass
> node-sass@5.0.0 install D:\WorkSpace\node-sass-test\node_modules\gulp-sass\node_modules\node-sass
> node scripts/install.js

Downloading binary from http://npm.taobao.org/mirrors/node-sass/v5.0.0/win32-x64-72_binding.node

如果你的辦公環境不能訪問外網,那麼可以從有網路的電腦上將.node檔案(下載對應 node-sass 版本以及對應作業系統的)下載過來,再傳到離線的電腦上指定 binary 路徑來安裝,執行以下命令完成安裝:

npm i -D node-sass@5.0.0 --sass_binary_path=D:\files\win32-x64-72_binding.node

二、本地編譯沒有Python環境

方法1:透過 NPM 包

網路正常的情況下安裝 node-sass 是不需要Python環境的,如果拉不下來對應的binding.node就會進入嘗試【本地編譯】,然後會檢查是否具備的條件:需要python環境,報的錯一般就會提示python沒有安裝(還是 Mac 香,自帶python環境沒有這些煩惱),安裝下面兩個包可以快速解決:

不過需要注意:拉包的方式需要cmd用管理員模式開啟! ! !

npm install -g node-gyp
npm install --global --production windows-build-tools

如果本地有網路還好,這兩個包如果安裝成功了,node-sass 基本就能安裝成功了,但是如果你的辦公環境限制網路可能也比較坑,參考:離線安裝 node-gyp

方法2:搭建Python環境(建議2.7)

  • 1、去官網下載 www.python.org/download/re…
  • 2、安裝成功之後,在環境變數中的系統變數新增python的安裝路徑;
  • 3、執行 npm rebuild node-sass 重構一下;
  • 4、再重新執行 npm install node-sass

三、node-sass版本與當前Node版本不匹配

因node版本與node-sass版本不匹配導致 binding.node 拉不下來,無法編譯。

node-sass 版本的相容性不好,老專案中依賴的 node-sass 很可能已經不相容新的 node 版本,對應版本相容參考如下(或官方倉庫):

NodeJSSupported node-sass versionNode Module
Node 20 9.0+ 115
Node 19 8.0+ 111
Node 18 8.0+ 108
Node 17 7.0+, <8.0 102
Node 16 6.0+ 93
Node 15 5.0+, <7.0 88
Node 14 4.14+, <9.0 83
Node 13 4.13+, <5.0 79
Node 12 4.12+, <8.0 72
Node 11 4.10+, <5.0 67
Node 10 4.9+, <6.0 64
Node 8 4.5.3+, <5.0 57
Node <8 <5.0 <57
安裝node-sass失敗原因及解決辦法彙總

比如我在 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

出現 404 了,此時更換 node-sass 或 node 的版本即可。

具體參考方案:

npm i node-sass@4.8.3

因為Node 8 不能裝 node-sass 3.x 這是肯定的(Node 7才對應 3.x),所以得裝 node-sass 4.x。

如果專案中還有 gulp-sass 之類的包,而 gulp-sass 2.x 裡面用了 node-sass 3.x,還是會有坑,所以 gulp-sass 得換到 3.x,建議安裝 gulp-sass@3.2.1。

四、沒有清理快取

每次裝包失敗報錯後記得都要 npm uninstall xxx 清除裝包錯誤留下的快取。

比如 npm i -D node-sass 報錯了,就要執行一遍 npm uninstall node-sass,然後再重新安裝

相關文章