第一步：ruby安裝

因為sass是依賴於ruby的，所以需要先安裝ruby。官網下載ruby

安裝過程中，請注意，勾選 Add Ruby executables to your PATH 選項，可以保證在系統中新增好環境變數，防止之後在編譯軟體中發生找不到ruby環境的錯誤。另，安裝地址無特殊要求。

第二步：sass安裝

安裝完ruby後，可在選單中找到ruby，開啟 Start Command Prompt with Ruby

在命令列中輸入

gem install sass 

enter確認，等待一會後提示安裝成功。

因為眾所周知的網路問題，如果沒有安裝成功，可以利用淘寶的RubyGems映象安裝sass。

首先，我們需要把預設的https://rubygems.org源移除

gem sources --remove https://rubygems.org/

然後新增淘寶的源https://ruby.taobao.org/

gem sources -a https://ruby.taobao.org/

之後可以檢視一下當前使用的源

gem sources -l

如果顯示是淘寶的，那麼就可以輸入安裝sass命令

gem install sass

更多的gem命令可以點這裡喵

第三步：sublime中安裝相關外掛

選擇 Sass 與 Sass Builder安裝。

第四步：測試

在 Sublime 中新建檔案 test.scss

$color: #369;

body {

background: darken($color, 10%);

}

Ctrl+B，進行編譯。如果成功，則顯示

write C:\Users\work/test.css

……

如果未編譯成功，則顯示

[Decode error - output not utf-8]

……

針對這個坑，有兩種解決方法。

1.第一步中就提醒要勾選 Add Ruby executables to your PATH 選項，如果沒有勾選，那麼就會造成該問題。解決方法是：

右鍵 我的電腦（此電腦），選擇 屬性

確定後，重啟Sublime和相關檔案，即可Ctrl+B編譯成功。

2.如果上面的方法還是沒有填上這個坑，那就在試試這個方法吧。如果之前，輸入

 sass -v 

沒有正確輸出sass的版本號，那就再執行一次

gem install rails

命令，安裝gem。回到Sublime中，看看是否可以編譯成功了呢。

最後是學習sass的網站：

填坑參考：