在安裝前端依賴node-sass時，出現(xiàn)了各種問題，經(jīng)過搜索資料，整理如下完整安裝步驟。筆者測試了兩遍都可以成功安裝，有需要的小伙伴可以按照步驟進(jìn)行下載。

當(dāng)然，默認(rèn)大家的node環(huán)境是完善的，這里就不做說明。

作者這里使用的是node v14.16.0，大家可以用node -v查看自己node版本。

1、配置國內(nèi)淘寶鏡像

在使用npm下載依賴包的時候，默認(rèn)使用的是國外的鏡像，下載速度比較慢，為了避免不必要的問題，我們設(shè)置下載鏡像為國內(nèi)的淘寶鏡像。

npm config set registry https://registry.npm.taobao.org/

配置完成后，可以使用npm config get registry來查看配置是否生效。

2、選擇node-sass的版本

node版本與node-sass的版本需要對應(yīng)。

這一點(diǎn)非常重要，版本不對應(yīng)會出現(xiàn)各種各樣的問題，導(dǎo)致node-sass下載失敗。

由于我使用的node版本是14.16.0，所以選擇node-sass 4.14.1。

更多版本之間的對應(yīng)關(guān)系，參考https://github.com/sass/node-sass

3、選擇sass-loader的版本

node-sass編譯完成，需要sass-loader進(jìn)行解析執(zhí)行，所以他們的版本同樣需要匹配。

這里我選擇的版本是sass-loader 6.0.6。

當(dāng)然別的作者說7.3.1也ok，這個筆者沒有測試，感興趣的小伙伴可以試一下。

4、安裝報錯，缺少python環(huán)境

這種情況，是缺少python環(huán)境導(dǎo)致，node-sass是需要用到python環(huán)境支持的，我們可以通過以下步驟解決：

4.1 刪除工程的node_modules文件夾

4.2 以管理員身份打開dos窗口

后續(xù)安裝需要用到管理員權(quán)限

4.3 安裝node-gyp

npm install -g node-gyp

4.4 安裝windows-build-tools

需要管理員權(quán)限

npm install --global --production windows-build-tools

這里可能出現(xiàn)的問題：

1、下載緩慢

【解決】.NET Framework版本過低，升級版本即可。（筆者用的版本是 4.8）下載地址：

https://dotnet.microsoft.com/download/visual-studio-sdks

查看版本方式，后續(xù)補(bǔ)充。

2、Visual Studio Build Tools一直處于“Still waiting for installer log file…

”狀態(tài)，如下圖所示

【解決】一般情況python下載比較快，Visual Studio Build Tools就經(jīng)常卡住不動。

這時候我們不需要等待，直接ctrl+c停止，然后輸入以下命令

npm install --global --production windows-build-tools --vs2015

稍等一會兒，即可安裝成功。

特別注意

python安裝后要進(jìn)行環(huán)境配置，在系統(tǒng)path中增加python路徑（這個路徑在npm下載windows-build-tools時會顯示）。配置完成后，cmd窗口查看python版本：python --version 可以查看到版本信息。

5、重新npm install即可

在以上步驟完成后，安裝node-sass成功！

這些僅為個人經(jīng)驗(yàn)，希望能給大家一個參考，也希望大家多多支持腳本之家。

最新評論