mac下webstorm添加scss watcher

一、前提条件：

1.安装ruby，如果我没记错的话，mac自带ruby，终端输入 ruby -v ，回车，如果显示ruby的版本号，则说明ruby环境已经安装好了。如果没有，自行安装ruby。例如我的mac显示：

ruby 2.0.0p648 (2015-12-16 revision 53162) [universal.x86_64-darwin15]

 

2.安装sass,过程与win系统的一样，安装好后，终端输入 sass -v，回车，若显示sass版本号，说明已经安装好了。

例如我的mac显示：

tydeMacBook-Pro:~ ty$ sass -v
Sass 3.4.21 (Selective Steve)

二、在webstorm中配置scss watcher

1. 打开一个sass文件，上方会显示一条提示信息如下，点击Add watcher，打开scss watcher的配置窗口。

 

2.在新打开的窗口中，在Program一项中配置scss.bat的路径。然后点OK退出。至此配置完成，以后只要是在这个项目内，任意地方编辑sass文件、都会自动的生成对应的CSS文件和更新CSS代码。

 

ps:我发现这个scss watcher并不好用。提示我找不到compass/reset，我估计是因为我的sass文件里引用的模块的路径的问题，或者其他配置问题，反正最后我还是干脆回终端窗口里用compass compile来转换sass到CSS了。