sass基於ruby引擎,因此安裝時ass、compass以前須要安裝ruby。具體的連接應該是(http://rubyinstaller.org/downloads)。下載並安裝相應的版本,勾選第二項(要在cmd中使用ruby)。css
打開命令行,輸入ruby -v,查看咱們安裝的ruby版本信息。shell
ruby安裝完成以後,打開ruby的command面板,接下來就是安裝sass了。Windows下安裝sass有多種方法,這裏說一下其中的兩種:windows
一、到 Rubygems(http://rubygems.org/) 下載 Sass 的安裝包(http://rubygems.org/gems/sass),而後在cmd輸入:sass
gem install <把下載的安裝包拖到這裏>
回車!ruby
二、打開cmd,輸入 gem install sass --version=3.4.22(可選版本),回車。(卸載方法: gem uninstall sass --version=3.4.22)。ui
接下來開始在sublime中安裝sass插件spa
打開sublime,ctrl+shift+p,輸入install,選擇第一個(Package Control)回車插件
命令框中輸入Sass,選擇,回車!(一樣的步驟,命令框中輸入SassBuild,選擇,回車!)。命令行
Ctrl+shift+p,輸入list packages,回車,能夠看到插件列表,若是其中有Sass和SassBuild,說明安裝成功了。、3d
寫完scss文件後,Ctrl+b就能夠編譯了,但默認編譯後的css文件和scss文件放在同一個文件夾,寫項目的時候可能會有不少css文件,有固定的css文件夾,這時候就須要把編譯後的css文件,放到這個指定的文件夾了,手動移動的話,有點麻煩,那就跟着下面的步驟設置一下吧。
一、Tools -> Build System -> New Build System
二、粘貼以下代碼:
{
"cmd": ["sass", "--update", "$file:${file_path}/../css/${file_base_name}.css"],
"selector": "source.sass, source.scss",
"line_regex": "Line ([0-9]+):",
"osx":
{
"path": "/usr/local/bin:$PATH"
},
"windows":
{
"shell": "true"
}
}
保存到Sublime Text3 Packages下,新建MySass文件夾,保存文件名MySass.sublime。
三、Tools -> Build System -> MySass ,選擇編譯類型。
這樣設置之後,如項目中有css文件夾,就會編譯到css文件夾中,若是沒有,會自動生成一個css文件夾,用於保存編譯後的css文件。
而後Ctrl+b,盡情編譯吧!