Sass開發環境的配置

創建運行Sass的環境

ruby安裝

因為sass依賴于ruby環境，所以裝sass之前先確認裝了ruby。先導官網下載個ruby

在安裝的時候，請勾選Add Ruby executables to your PATH這個選項，添加環境變量，不然以后使用編譯軟件的時候會提示找不到ruby環境

安裝完ruby之后，在開始菜單中，找到剛才我們安裝的ruby，打開Start Command Prompt with Ruby

安裝sass

<1>Sass的安裝:

Ruby命令行下輸入下面的命令：
gem install sass

<2>Compass的安裝:
Ruby命令行下輸入下面的命令：

gem install compass

<3>創建一個 COMPASS 項目
在命令行中切換到你需要創建項目的目錄，運行：
compass create  projectname

這個命令會創建一個包含一系列文件的目錄，其中最重要的是配置文件 config.rb，其他文件如果你不需要都可以刪除。

在 config.rb 中你可以修改 SASS 和 CSS 的目錄及其它一些基礎設置。
<4>實時編譯 SASS 文件
COMPASS 提供的默認方法是：
在命令行下切換到項目目錄，運行
compass watch

將會實時監控 SASS 目錄的文件變化，只要你一保存文件，立即將相應文件編譯為 CSS 文件。

<5>SASS文件就是普通的文本文件，里面可以直接使用CSS語法。文件后綴名是.scss，意思為Sassy CSS。SASS提供兩種編譯方式，一種是手動編譯，一種是監視編譯(–watch)，手動編譯就是當你撰寫好CSS時下指令去做編譯，監視編譯則是你指令一個目錄，當此目錄里面的*.scss檔案有改變時（新增、覆寫等等），就會自動去做編譯的動作。先來講手動編譯方式：
下面的命令，可以在屏幕上顯示.scss文件轉化的css代碼。（假設文件名為test。）
sass test.scss
如果要將顯示結果保存成文件，后面再跟一個.css文件名。
sass test.scss test.css
SASS提供四個編譯風格的選項：
* nested：嵌套縮進的css代碼，它是默認值。
* expanded：沒有縮進的、擴展的css代碼。
* compact：簡潔格式的css代碼。
* compressed：壓縮后的css代碼。
生產環境當中，一般使用最后一個選項。
sass –style compressed test.sass test.css
還有一種監視的方式做編譯，在命令行中切換到當前sass或者scss文件所在的目錄，然后運行
sass –watch scss:css