Mac & Window 打造 Sass + Compass 環境（ 建立 Compass 專案）

Step1 : Ruby 環境

因為 Sass 是由 Ruby 程式語言寫成，所以必須從 Ruby 環境下安裝

Mac：

由於已經安裝好了Ruby，所以只要直接開啟終端機 Terminal 輸入

$ gem update --system" //先更新 gem

$ gem install compass" // 安裝 Compass

由於用 SASS 的都會搭配 Compass 使用，所以可以直接裝 Compass，電腦會自動安裝 Sass

如果出現錯誤訊息 : ERROR:  While executing gem ... (Gem::FilePermissionError) 則改輸入：

$ sudo gem update --system"

用意為提高執行權限，此時會要求輸入電腦管理者密碼。

Window：

Windows 必須先安裝 Ruby，請至 RubyInstaller 下載安裝程式，跟著軟體指令安裝完成後，開啟 Ruby 的命令提示字元（以管理員的權限開啟），執行以下指令確定是否有安裝成功：

ruby -v

顯示結果會出現 Ruby 的版本，那就說明你成功了。

接下來可以下與 Mac 相同指令，先更新 gem 再安裝 Compass 。

$ gem update --system" //先更新 gem

$ gem install compass //安裝 Compass

由於用 SASS 的都會搭配 Compass 使用，所以這直接裝 Compass，電腦會自動安裝 Sass

Step2 : 建立 Compass 專案

接下來 Mac 皆與 Window 皆輸入同樣的指令

先指定到要建立專案的目錄，例如已在 D:\ 開了一個資料夾稱 Text 放專案

$ cd d:/Text                      //先把位置指定到目錄下

再建立專案文件

$ compass creat project    //建立專案，“project” 是自訂的專案名稱

接下來就可以看見 Text 資料夾下已建立以下檔案


為了使SASS順利編譯成CSS，則必須在終端機再輸入

$ compass watch

接下來就可以開始編輯SASS檔案了，記得每次要求編譯時，要先指定到該資料然後 watch。如果自行多建立 SASS 文件，則在編譯時，css資料夾會自動產生該文件css檔。

Step3 : config.rb  設定

可以在 config.rb 檔內做 css、sass、images 等資料夾設定


說明1: [ output_style ]  CSS碼有下述四種編譯方式：
expanded = 一般。每行 CSS 皆會斷行
nested = 有縮進。較好閱讀。
compact = 簡潔。匯出來的 CSS 檔案大小比較小。
compressed = 壓縮。壓縮過的CSS。

 以上是比較常用的，更詳細可以看官方教學