在webstorm下使用compass 和 sass

1. 原文地址 http://jingyan.baidu.com/article/fa4125acde99f928ac7092a9.html

2. 1

   以前爲了進階css，狠抓了一下sass（如今叫scss，編程風格和css相似）和它的框架compass，因爲本人對命令行的恐懼，所以總想將其弄到IDE中。

3. 2

   先安裝ruby，sass，compass。

   http://www.w3cplus.com/sassguide/install.html

   連接裏沒有compass。直接鍵入下面的命令行：

   gem install compass

   能夠用sass -v 和 compass -v 查看版本。

   建立一個compass 項目。

   compass create yourProjectName

4. 3

   打開webstorm，進入setting -> Tools -> File Watchers.

   添加一個compass scss 監聽器。

8. 4

   當你引用compass的內建庫如 @import "compass/css3" 時，webstorm會給你報錯，這是你須要進行下面的操做。 

   setting -> Languages && Frameworks -> Compass

   記得 應用 和 保存。

10. 5

    若是你想在在谷歌中直接看到 xxx.scss 而不是編譯後的css , 須要進行下面的配置。

    在谷歌中按 F12，在 Setting -> General -> Source。 

    對 config.rb 中 添加 sourcemap = true