Sass&Compass安裝使用

  1. 安裝Ruby環境


    安裝后找到此路徑
  2. 安裝Sass
    <pre>gem install sass</pre>
    若不能直接安裝，則使用淘寶鏡像：
    <pre>
    $ gem sources --remove https://rubygems.org/
    $ gem sources -a https://ruby.taobao.org/
    $ gem sources -l
    *** CURRENT SOURCES ***
    https://ruby.taobao.org

請確保只有 ruby.taobao.org

$ gem install sass //再次安裝Sass
$ sass -v //查看安裝版本
</pre>

  1. 安裝Compass
    <pre>gem install compass</pre>
    查看安裝版本：
    <pre>compass -v</pre>
  2. 創建目錄文件

在任意位置使用命令行：
<pre>compass create yourPro</pre>

自動創建sass目錄

如圖，創建了mySass的文件夾，下面創建了sass文件夾和stylesheets文件夾以及配置文件config.rb。

  1. 實時監聽
    在當前目錄下：
    <pre>compass watch</pre>
    當scss文件修改時，會自動修改css。
    在對應的css文件中標注了對應scss的位置，所以調試也可以直接通過注釋找到scss位置。

到此為止，一個簡單的Sass環境就搭建好了啦

最后編輯于 ：
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明：文章內容（如有圖片或視頻亦包括在內）由作者上傳并發布，文章內容僅代表作者本人觀點，簡書系信息發布平臺，僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 前言 由于sass是ruby語言開發的，所以安裝sass時，必須安裝ruby環境 檢查是否安裝ruby（ruby版...
    Carrie_Gu閱讀 2,330評論 0贊 0
  • 1.背景介紹 CSS 是一門非程序式語言，沒有變量、函數、SCOPE（作用域），需要書寫大量看似沒有邏輯的代碼，不...
    遠望的云閱讀 32,197評論 3贊 35
  • 從相識到相處，從開始到結束，我們一直是那么的陌生。可能是因為你的高冷，讓我只能用各種挑剔來掩蓋我對你的喜歡。我們...
    呦呦_yy閱讀 190評論 0贊 0
  • 好久沒寫作業了，今天經歷了兩件事，一件有了明確的結果，一件有了50%的結果，想把這兩件事的發展都問一下，于...
    魚兒加加閱讀 184評論 0贊 0
  • 現在21歲的我，覺得自己懂的很多，可是再怎么了解現實，認知社會，卻始終不能也不會邁出獨行的這一步。 從出生，到幼兒...
    王大羽羽羽閱讀 194評論 0贊 0