摘要：此后，全局安裝的模塊都會安裝在這個子目錄中，也會到目錄去尋找命令。最后，將這個路徑在文件或文件中加入變量。

記錄一下安裝node-sass的過程.關于CSS是不是一門編程語言,這里不討論,但是它沒有變量 語句 函數(反正我覺得他不是編程語言).于是程序員們發明了CSS預處理器(css preprocessor),它是一種專門的編程語言,可以使用你會的基本的編程知識進行編程,然后再轉化成css文件.

主流的CSS預處理器有8種,我們今天介紹sass.它的官網,不過需要安裝ruby.

不想安ruby,那就借助node安裝node-sass吧.github主頁

本人是deepin Linux 15.5版本

由于node-sass會去github主頁下載binding-node,然后又去亞馬遜去下載,所以國內因為一些不可抗力無法下載.簡單的進行如下的設置,都是初學者,我就不用命令的形式寫了,下面直接寫上內容.基本的命令用多了也就會了.

在主目錄下建立一個.npmrc的文件,在里面加上

sass_binary_site=https://npm.taobao.org/mirrors/node-sass/
phantomjs_cdnurl=https://npm.taobao.org/mirrors/phantomjs/
electron_mirror=https://npm.taobao.org/mirrors/electron/
registry=https://registry.npm.taobao.org/
//順序好像會有影響,我一開始不是這個順序,后來改成這個,能安裝成功

還必須在主目錄的.bashrc下添加

export SASS_BINARY_SITE="https://npm.taobao.org/mirrors/node-sass"

好了,按理說可以用如下命令正常安裝了,但是出問題了.

npm i -g node-sass

用了上述的命令,我第一次就報錯,Error顯示說權限不夠,我果斷用了

sudo npm i  -g node-sass

恩,然后就是無休止的錯誤,ctrl+c終止后,發現node_modules里面有node-sass,但是明顯不能用.去github的issue上搜,大神都是用了

npm rebulid node-sass

然而成功是屬于其他人的.

我試了一下,又是報錯, 還是權限不夠,我又加了sudo.

恩,又是報錯.此時我很煩,你說沒權限,我加了權限你又報錯,這個死循環.......

沒辦法,生活還要繼續,又去stackoverflow和github上搜,在node-sass的項目的Troubleshooting上發現了問題所在,如下是Linux部分的官方文檔

Linux
This can happen if you are install node-sass as?root, or globally with?sudo. This is a security feature of?npm. You should always avoid running?npm?as?sudo?because install scripts can be unintentionally malicious. Please check?npm documentation on fixing permissions.
If you must however, you can work around this error by using the?--unsafe-perm?flag with npm install i.e.
$ sudo npm install --unsafe-perm -g node-sass
If this didn"t solve your problem please open an issue with the output from?our debugging script.

文檔說: 當你用root角色或者全局使用sudo命令安裝的時候,就會發生這個錯誤.(-媽個雞,我就是全局安裝node-sass啊),不過人家說了,這是npm的安全特性.(-你牛你說啥都行),你應該總是避免使用sudo去執行npm,因為安裝腳本會發生意想不到的致命錯誤(-確實意想不到,以前我都是sudo安裝模塊,就這次栽了,不過你倒是說咋解決啊),請左轉去npm的官方文檔(- 這是重點,解決方法就在這里),如果你非要用sudo,用下面的命令吧..............如果這些仍沒有解決你的問題,請看了我們的debugging腳本里面的解決方法在開啟一個新的issue吧(如果大家還有和我不一樣的錯誤,這里有很多解決方法)our debugging script.

好了,翻譯完了,咱們去npm的第三章去看看咋解決.

第三章寫的寫的很明白.

如何避免權限錯誤

下面是文檔原文

If you see an EACCES error when you try to install a package globally, read this chapter. This error can be avoided if you change the directory where npm is installed. To do this, either:
Reinstall npm with a version manager (recommended),
or
Change npm"s default directory manually.

它說:如果你嘗試安裝一個全局的包,遇到了權限的錯誤,應該讀讀這一章.如果npm被安裝的時候你改變了npm的目錄,這個錯誤就會被避免(- 言下之意,就是讓你改目錄,就可以避免不能操作/usr/local/底下的內容了,你或者可以改變目錄的權限 chmod [mode] dir,效果應該一樣的,我沒試過,而且官方也沒說),要想做到這個,要么用版本管理工具重裝npm(- 官方推薦的),要么就手動改變npm的默認目錄(我用的這個).

好了,翻譯完了,如果你想用官方推薦的方法就用版本管理工具重裝npm,就去看文檔的第二章

官方推薦用nvm,我以前誤打誤撞安了一個TJ大神(尤雨溪的偶像)的n模塊( 不會用,就會升級,好尷尬啊)

還有一個

If you are using npm version 5.2 or greater, explore tools such as?npx?to circumvent permissions issues.

如果你的npm版本是5.2以上,可以用npx(又是好尷尬,我有npx,也不會用.....)

還有特別火的小貓yarn,快30000的star了(不過我沒用......)

恩,前端的世界很精彩啊.

Back-up your computer before moving forward.
Make a directory for global installations:
mkdir ~/.npm-global
Configure npm to use the new directory path:
npm config set prefix "~/.npm-global"
Open or create a ~/.profile file and add this line:
export PATH=~/.npm-global/bin:$PATH
Back on the command line, update your system variables:
source ~/.profile
Instead of steps 2-4, you can use the corresponding ENV variable (e.g. if you don"t want to modify ~/.profile):
NPM_CONFIG_PREFIX=~/.npm-global

官方確實夠詳細,也能用,你不想麻煩,就在環境變量里面NPM_CONFIG_PREFIX=~/.npm-global

我試過這個方法,不過建立的.npm-global隱藏得太深了,ctrl+H都看不到它,我就采用了阮一峰大神的方法,方法還是要用大神的博客的方法或者官方的啊.

首先，在主目錄下新建配置文件.npmrc，然后在該文件中將prefix變量定義到主目錄下面。

prefix = /home/yourUsername/npm

然后在主目錄下新建npm子目錄。

mkdir ~/npm

此后，全局安裝的模塊都會安裝在這個子目錄中，npm也會到~/npm/bin目錄去尋找命令。
最后，將這個路徑在.bash_profile文件（或.bashrc文件）中加入PATH變量。

export PATH=~/npm/bin:$PATH

做完這個之后,全局卸載不能用的node-sass,再npm i -g node-sass

# 卸載全局模塊
$ npm uninstall [package name] -global

很遺憾,舊目錄的沒刪成功,不過新目錄的能用就行........................

1. 一定不要用sudo安裝,先手動改npm的目錄
2. 更改.npmrc 和 .bashrc
3. npm i -g node-sass
4. 英語多學點,文檔多看點,命令行多用點.

它的使用方法和ruby的sass有一點小區別

node-sass -wr scss -o css

官方使用手冊

阮一峰教程