如何安裝Sass

2021-08-16 01:40:29 字數 3440 閱讀 5742

sass基於ruby語言開發而成，因此安裝sass前需要安裝ruby。（注:mac下自帶ruby無需在安裝ruby!）

安裝完成後需測試安裝有沒有成功,執行cmd輸入以下命令：

ruby -v


//如安裝成功會列印


ruby 2.2


.2p95 (2015-04-13 revision 50295) [i386-mingw32]
如上已經安裝成功。但因為國內網路的問題導致gem源間歇性中斷因此我們需要更換gem源。（使用**的gem源如下：

//1.刪除原gem源


//2.新增國內**源


//3.列印是否替換成功


gem sources -l


//4.更換成功後列印如下
ruby自帶乙個叫做rubygems的系統，用來安裝基於ruby的軟體。我們可以使用這個系統來 輕鬆地安裝sass和compass。要安裝最新版本的sass和compass，你需要輸入下面的命令：

//安裝如下(如mac安裝遇到許可權問題需加 sudo gem install sass)


gem install sass


gem install compass
在每乙個安裝過程中，你都會看到如下輸出：

fetching: sass-3.x.x.gem (100%)


successfully installed sass-3.x.x


parsing documentation for sass-3.x.x


installing ri documentation for sass-3.x.x


done installing documentation for sass after 6 secon


1 gem installed
安裝完成之後，你應該通過執行下面的命令來確認應用已經正確地安裝到了電腦中：

sass -v


sass 3.x.x (selective steve)


compass -v


compass 1.x.x (polaris)


released under the mit license.


compass is charityware.


please make a tax deductable donation for a worthy cause:
如下sass常用更新、檢視版本、sass命令幫助等命令：

//更新sass


gem update sass


//檢視sass版本


sass -v


//檢視sass幫助


sass -h
sass編譯有很多種方式，如命令列編譯模式、sublime外掛程式sass-build、編譯軟體koala、前端自動化軟體codekit、grunt打造前端自動化工作流grunt-sass、gulp打造前端自動化工作流gulp-ruby-sass等。

//單檔案轉換命令


sass input.scss output.css


//單檔案監聽命令


sass --watch input.scss:output.css
命令列編譯sass有配置選項，如編譯過後css排版、生成除錯map、開啟debug資訊等，可通過使用命令sass -v檢視詳細。我們一般常用兩種--style``--sourcemap。

//編譯格式


sass --watch input.scss:output.css --style compact


//編譯新增除錯map


sass --watch input.scss:output.css --sourcemap


//選擇編譯格式並新增除錯map


sass --watch input.scss:output.css --style expanded --sourcemap


//開啟debug資訊


sass --watch input.scss:output.css --debug-info


//未編譯樣式


.box 


}
/*命令列內容*/


sass


style.scss:style.css --style nested


/*編譯過後樣式*/


.box 


.box-title


/*命令列內容*/


sass


style.scss:style.css --style expanded


/*編譯過後樣式*/


.box 


.box-title


/*命令列內容*/


sass


style.scss:style.css --style compact


/*編譯過後樣式*/


.box 


.box-title


/*命令列內容*/


sass


style


.scss


:style


.css


--style


compressed


/*編譯過後樣式*/


koala是乙個國產免費前端預處理器語言圖形編譯工具，支援less、sass、compass、coffeescript，幫助web開發者更高效地使用它們進行開發。跨平台執行，完美相容windows、linux、mac。
 
如何安裝Sass
sass基於ruby語言開發而成，因此安裝sass前需要安裝ruby。注 mac下自帶ruby無需在安裝ruby 安裝完成後需測試安裝有沒有成功,執行cmd輸入以下命令 ruby v 如安裝成功會列印 ruby 2.2.2p95 2015 04 13 revision 50295 i386 ming...


Sass教程二 Sass的安裝
前面已經提到了，sass是用ruby語言開發的，所以在安裝sass之前，需要先安裝ruby ruby安裝好了之後，我們就可以利用ruby的包管理工具gem安裝sass了，同樣還是在cmd裡執行以下命令 gem install sass安裝完成之後，還是老辦法檢查以下安裝是否成功 sass v 如果安...


sass安裝教程
在安裝的時候，請勾選add ruby executables to your path這個選項，新增環境變數，不然以後使用編譯軟體的時候會提示找不到ruby環境 安裝完ruby之後，在開始選單中，找到剛才我們安裝的ruby，開啟start command prompt with ruby 然後直接在...