天天看點

Sass學習筆記 -- 在Windows系統中安裝Sass和Compass

Sass和Compass都是基于Ruby程式設計語言的指令行工具。要使用它們,你首先需要在電腦中安裝Ruby,Windows系統并沒有預置Ruby,是以如果你之前沒有安裝過Ruby,現在就需要進行安裝。安 裝Ruby隻需要花費幾分鐘的時間。

<a href="http://s2.51cto.com/wyfs02/M02/89/F4/wKiom1ginYvSt7dzAAEd3m406sk436.png" target="_blank"></a>

按照提示,點選下一步,注意這裡需要全部勾選

<a href="http://s1.51cto.com/wyfs02/M02/89/F1/wKioL1ginoXDMnLdAABfK_klOPM958.png" target="_blank"></a>

安裝完成以後,進入指令行工具,輸入“ruby -v”檢視版本号

<a href="http://s5.51cto.com/wyfs02/M01/89/F4/wKiom1ginwzAgewZAAAIZmVcPqQ381.png" target="_blank"></a>

接下來就是安裝sass了,如果不幸被牆了,安裝失敗的話,可以參照下面的步驟

1、移除預設源

2、下載下傳SSL證書

<a href="http://s5.51cto.com/wyfs02/M00/89/F4/wKiom1gioHSAAhilAACvfZGD5Os310.png" target="_blank"></a>

在彈出的新頁面中,把所有的内容複制一份存到txt文檔裡面,儲存時把編碼方式改成utf-8,然後命名為“cacert.pem”,把這個檔案存到C槽Ruby檔案夾下面

<a href="http://s4.51cto.com/wyfs02/M00/89/F4/wKiom1gioOziK5ExAABlXXqwMiw059.png" target="_blank"></a>

右鍵點選“我的電腦”- “屬性”-“進階系統設定”-“環境變量”,按照下圖操作

<a href="http://s1.51cto.com/wyfs02/M01/89/F1/wKioL1gioWXTXlssAABx9WNS_Q8204.png" target="_blank"></a>

3、配置為淘寶源

指令行輸入: gem sources -a https://ruby.taobao.org/

<a href="http://s1.51cto.com/wyfs02/M00/89/F4/wKiom1giqiPyKXvvAAAdMjWf8Yw655.png" target="_blank"></a>

4、檢視目前源

指令行輸入: gem sources

<a href="http://s5.51cto.com/wyfs02/M00/89/F1/wKioL1giqmfTnu-kAAAIzGT7tbs439.png" target="_blank"></a>

5、确定是淘寶源以後,執行該安裝sass指令

指令行輸入:gem install sass  

<a href="http://s5.51cto.com/wyfs02/M01/89/F1/wKioL1giqrqTXE-7AAAVUOlPNIU701.png" target="_blank"></a>

指令行輸入:sass -v  檢視sass是否安裝成功

<a href="http://s5.51cto.com/wyfs02/M01/89/F4/wKiom1giqwnj8mq5AAAGpnBDqN8323.png" target="_blank"></a>

安裝compass

指令行輸入:gem install compass  

<a href="http://s4.51cto.com/wyfs02/M02/89/F4/wKiom1giq1mQuxwSAACQ__DNgLM030.png" target="_blank"></a>

指令行輸入:compass -v  檢視compass是否安裝成功

<a href="http://s3.51cto.com/wyfs02/M02/89/F1/wKioL1giq4ez8TssAAAUg3Qcsvw070.png" target="_blank"></a>

安裝的過程中遇到了很多問題,百度搜尋了很多都沒能解決,最後是看了“會飛的魚lala”才得以安裝成功,感謝部落客!

附上連結:http://www.cnblogs.com/flyings/p/5355872.html

本文轉自   frwupeng517   51CTO部落格,原文連結:http://blog.51cto.com/dapengtalk/1871036

上一篇: RH134 UNIT4
下一篇: 标簽頁切換