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 然後直接在...