[原文] http://www.th7.cn/web/js/201511/135415.shtml
如果你正在構(gòu)建一個(gè)基于 gulp 的前端自動(dòng)化開(kāi)發(fā)環(huán)境微渠,那么極有可能會(huì)用到 gulp-sass ,由于網(wǎng)絡(luò)原因你可能會(huì)安裝失敗篮赢,因?yàn)榘惭b過(guò)程中部分細(xì)節(jié)會(huì)到亞馬遜云服務(wù)器上獲取文件。本文主要討論在不變更網(wǎng)絡(luò)環(huán)境的前提下安裝 gulp-sass / node-sass 稍算。
問(wèn)題描述
執(zhí)行 npm install 安裝軟件包 gulp-sass
$ npm install gulp-sass
這個(gè)過(guò)程中會(huì)先安裝 node-sass ,因?yàn)?gulp-sass 依賴于 node-sass 脚作。中間出現(xiàn)的錯(cuò)誤信息類似下面這樣:
Cannot download https://github.com/sass/node-sass/releases/download/v3.4.2/win32-x64-46_binding.nodeHint: If github.com is not accessible in your locationtry setting a proxy via HTTP_PROXY, e.g. export HTTP_PROXY=http://example.com:1234or configure npm proxy vianpm config set proxy http://example.com:8080'
處理思路
看現(xiàn)象很有可能是這些二進(jìn)制文件使用了 GitHub 的 lfs 服務(wù)警没,而 lfs 使用的是亞馬遜云匈辱,由于網(wǎng)絡(luò)原因,這些服務(wù)器無(wú)法訪問(wèn)杀迹。
現(xiàn)在解決問(wèn)題的辦法思路就很清晰了亡脸,下載源碼自己編譯一個(gè)這樣的二進(jìn)制文件,或下載官方的二進(jìn)制文件树酪。只要解決該文件的下載問(wèn)題就可以繼續(xù)往后安裝浅碾。
打開(kāi) github 看一下該項(xiàng)目 https://github.com/sass/node-sass,在 releases 頁(yè)面能找到下失敗的文件 win32-x64-46_binding.node 续语,這里還可以下載到 source code垂谢,下載后里頭有 C++ 項(xiàng)目 使用 visualstudio2015 自己編譯一個(gè)就可以了。
同時(shí)疮茄,在 https://github.com/sass 下滥朱,還發(fā)現(xiàn)一個(gè)名字叫 node-sass-binaries 的項(xiàng)目,這里頭其實(shí)也有剛才的那個(gè)二進(jìn)制文件力试,并且這里的是可以直接下載的(貌似沒(méi)使用 lfs)徙邻。
我不想自找麻煩,所以下面說(shuō)一下直接使用該項(xiàng)目中的二進(jìn)制文件進(jìn)行安裝 node-sass 過(guò)程畸裳。
操作
npm 是一個(gè)功能超級(jí)強(qiáng)悍的工具缰犁,安裝一個(gè)軟件包的方式也當(dāng)然不僅僅是 npm install packagename 這一種方式,當(dāng)然這是最快捷的使用公共軟件包的安裝方式。
首先到官網(wǎng)(https://github.com/sass/node-sass/releases)下載 node-sass 項(xiàng)目源碼帅容,下載后解壓至相應(yīng)的 node_modules 目錄中颇象。
接下來(lái),打開(kāi) package.json 文件并徘,檢查 script 字段
"scripts": { "coverage": "node scripts/coverage.js", "install": "node scripts/install.js", "postinstall": "node scripts/build.js", "pretest": "node_modules/.bin/jshint bin lib scripts test", "test": "node_modules/.bin/mocha test" },
打開(kāi) install 字段對(duì)應(yīng)的文件 scripts/install.js遣钳,可以看到 checkAndDownloadBinary() 在下載這個(gè)二進(jìn)制文件,URL使用的是 process.sass.binaryUrl饮亏,我們可以直接在這里覆蓋這個(gè)變量,把改地址修改為上面提到的那個(gè)能夠下載的二進(jìn)制文件地址阅爽。
download(process.sass.binaryUrl, process.sass.binaryPath, function(err) { ....}
或者路幸,找出上面提到的 sass.binaryUrl() 方法,打開(kāi) ../lib/extensions.js 文件付翁,大約108行左右简肴,修改為如下樣子即可
function getBinaryUrl() { var site = flags['--sass-binary-site'] || process.env.SASS_BINARY_SITE || process.env.npm_config_sass_binary_site || (pkg.nodeSassConfig && pkg.nodeSassConfig.binarySite) || 'https://github.com/sass/node-sass/releases/download'; //return [site, 'v' + pkg.version, sass.binaryName].join('/'); return 'https://github.com/sass/node-sass-binaries/blob/master/win32-x64-46_binding.node';}
重新安裝
進(jìn)入node-sass 項(xiàng)目根目錄執(zhí)行 install 命令:
$ cd node_modules/node-sass$ npm install
如果不出意外,這個(gè)安裝過(guò)程很快就會(huì)結(jié)束百侧。
node-sass 安裝完成后砰识,gulp-sass 的依賴問(wèn)題也就解決了,然后跳出去 node_modules 目錄繼續(xù)安裝 gulp 佣渴。
$ cd ../..npm install gulp-sass