一、前提条件:

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了。

mac下webstorm添加scss watcher的更多相关文章

  1. (原)Mac下Apache添加限制IP线程模块:mod_limitipconn.so

    1.下载:http://dominia.org/djao/limit/mod_limitipconn-0.24.tar.bz2 解压到一个目录:我的是~/Download/mod_limitipcon ...

  2. mac下 WebStorm下主题包安装

    mac下: 主题包 1.mac下,点击桌面,使用shift+command+G 输入:~/Library/Preferences 前往(mac查找安装目录的方法,因为默认这些文件夹是隐藏的),进入We ...

  3. mac下Apache添加限速模块mod_bw

    官方文档: Apache2 - Mod_bw v0.7 Author : Ivan Barrera A. (Bruce) HomePage : Http://Ivn.cl/apache & h ...

  4. Mac 下 Eclipse 添加 Dynamic Web Project 并配置 Tomcat

    最近拿到了一个 Dynamic Web Project,我的 Mac 上的 Eclipse 之前没有过这类型的项目,所以导入之后无法正常运行.下面是我记录的如何配置 Eclipse 使之能够运行 Dy ...

  5. Mac下WebStorm直接运行ReactNative项目

    1.首先点击WebStorm右上方的下拉箭头弹出的Edit Configurations…. 2.然后会进入一个配置页面.点击左上方的+.在弹出的列表中选中npm. 3.在右边的配置框中,先选择Com ...

  6. Mac 下 WebStorm 配置go语言开发环境

    一.下载安装WebStorm,我的是 二.在WebStorm 中安装go插件 三.在本机安装go开发环境,直接装pkg文件,https://golang.org/doc/install 四.在WebS ...

  7. mac下php添加openssl扩展

    进入php源码目录 cd ext/openssl mv config0.m4 config.m4 phpize && ./configure  && make & ...

  8. mac 下webstorm调节字体大小

    ctr+shift+A功能可以搜索对应功能. 在弹出框中输入Zoom可以轻松设置. 而且有关zoom的功能全部列出. 真是方便. 搜索到change font size with ctrl + whe ...

  9. Mac下如何安装WebStorm + 破解

    1.官网下载       下载地址   选择好系统版本以后,点击DOWNLOAD        2.安装 双击下载好的安装包.将WebStromt拖入application文件夹,然后在Launchp ...

随机推荐

  1. suse linux 常用命令

    功能:rm 命令,删除一个目录中的一个或多个文件或目录(文件夹). 它也可以将某个目录及其下的所有文件及子目录均删除. 对于链接文件,只是删除了链接,原有文件均保持不变. 文件一旦被删除,它不能被恢复 ...

  2. ORA-00257: archiver error的解决方法

    背景:多个用户同时做测试数据,有时候突然Oracle系统就崩溃了,然后报一个ORA-00257: archiver error. Connect internal only, until freed的 ...

  3. 关于文件中的0D、0A

    文件一般分为文本文件和二进制文件. 在windows文本文件中,分行即‘\n“,表示为0x0D 0x0A.分为两种情况: 如果你想一个文本文件中写入一个'\n',文本文件中会增加0x0D 0x0A两个 ...

  4. Ant Design 常用命令汇总

    Ant Design React 安装 1. 安装脚手架工具# antd-init 是一个用于演示 antd 如何使用的脚手架工具,真实项目建议使用 dva-cli. $ npm install an ...

  5. 20145312 《Java程序设计》第四周学习总结

    20145312 <Java程序设计>第四周学习总结 学习笔记 Chapter 6 6.1何为继承 1.定义:面向对象中子类继承父类,避免重复的行为定义. 6.1.1 继承共同行为 1.以 ...

  6. 《Java程序设计》实验1实验报告

    20145318 <Java程序设计>实验1实验报告 实验题目 通过对500个数据进行操作,实现快速排序.选择排序.直接插入排序算法时间复杂度的比较:并在排序数据中快速查找某一数据,给出查 ...

  7. 20144303 《Java程序设计》第五周学习总结

    20144303 <Java程序设计>第五周学习总结 教材学习内容总结 第八章 异常处理 异常就是程序在运行时出现不正常情况,异常的由来是因为Java把出现的问题封装成了对象,换句话说Ja ...

  8. MysQL使用一高级应用(上)

    简介 实体与实体之间有3种对应关系,这些关系也需要存储下来 在开发中需要对存储的数据进行一些处理,用到内置的一些函数 视图用于完成查询语句的封装 事务可以保证复杂的增删改操作有效 关系 创建成绩表sc ...

  9. JavaConfig 使用Java代码进行显示配置

    从Spring 3起,JavaConfig功能已经包含在Spring核心模块,它允许开发者将bean定义和在Spring配置XML文件到Java类中. 需要先加载spring-context 包 &l ...

  10. Spring Boot 之restful风格

    步骤一:restful风格是什么? 我们知道在做web开发的过程中,method常用的值是get和post.可事实上,method值还可以是put和delete等等其他值. 既然method值如此丰富 ...