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

时间: 2024-10-24 03:01:09

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

mac下 WebStorm下主题包安装

mac下: 主题包 1.mac下,点击桌面,使用shift+command+G 输入:~/Library/Preferences 前往(mac查找安装目录的方法,因为默认这些文件夹是隐藏的),进入WebStorm /colors,然后把我们下载的xxx.xml文件放在里边,重启WebStorm 2.点击Webstorm-->Preferences-->Editor-->Colors & Fonts 右边的Schema name选择我们刚下载安装的那个

Mac下WebStorm直接运行ReactNative项目

1.首先点击WebStorm右上方的下拉箭头弹出的Edit Configurations…. 2.然后会进入一个配置页面.点击左上方的+.在弹出的列表中选中npm. 3.在右边的配置框中,先选择Command为help.接着点击下方的+号.再点击Run External tool 4.在弹出框中选择+号. 5.在弹出的配置框中,填写相应信息. Program为react Native的路径,终端命令:which react-native  一般都是   /usr/local/bin/react-

Mac下如何添加User到group中

创建所有组: sudo dscl . -create /groups/deploy 列出所有组: dscl . list /groups 增加deploy用户到deploy组:sudo dscl . -append /Groups/deploy GroupMembership deploy 删除deploy用户从deploy组: sudo dscl . -delete /Groups/deploy GroupMembership deploy

WebStorm mac下如何安装WebStorm + 破解

1.下载软件最好的地址就是官网了下载地址 选择好系统版本以后点击DOWNLOAD 下载Webstorm 2.安装双击下载好的安装包.将WebStromt拖入application文件夹,然后在Launchpad中找到并打开 安装.png 3.等待一段时间后,WebStorm将进行第一次运行,当出现如下页面的时候第一行选择Activate,第二行选择Activation code 现在直接获取注册码粘贴复制破解已经不能完美解决了,可以通过以下方式激活: 1.mac 下:先打开Finder ->按快

mac 下的头脑风暴软件 xLine icon 添加和取消

今天用的mac下的一款头脑风暴软件 xLine 感觉比较简单好用.其中有一个添加icon的功能,图片挺多也,就是有点太大了. 加拖拽可以添加,结果发现删除不了了. 最后在Inspector里发现了,删除方法.将其中的Image设置成None.

Mac 下永久路由的添加 & Mac 校园网连接教程

学校校园网面向全校师生开放,无奈Windows用户基数大,学校只为Windows平台制作了内网连接工具,Mac平台资源较少,本人查阅相关资料后,总结整理出以下步骤,方便本校学生连接校园网.有永久路由添加需求的用户,也可作为参考,如有错误,欢迎指正. 1.打开终端并打开,查看可连接上的网络地址 在终端输入以下指令,回车运行 netstat -rn 找到未连接互联网的状态下,依然能够连接上的学校的服务器网关地址,比如我在宿舍能连接到的172.19.27.1(不同楼层都有可能不同) 找到学校内网的地址

Mac破解WebStorm

转载地址:http://www.jianshu.com/p/492309c60348 1.去官网下载最新版WebStorm 2.双击下载好的安装包.将WebStromt拖入application文件夹,然后在Launchpad中找到并打开 3.等待一段时间后,WebStorm将进行第一次运行,当出现如下页面的时候第一行选择Activate,第二行选择License server,复制http://idea.iteblog.com/key.php这个链接到链接 4.mac 下:先打开Finder

mac 下基于firebreath 开发多浏览器支持的浏览器插件

首先要区分什么是浏览器扩展和浏览器插件;插件可以像本地程序一样做的更多 一. 关于 firebreath http://www.firebreath.org firebreath 是一个夸平台,夸浏览器的,开发浏览器插件框架: 利用firebreath开发的浏览器插件,可以在多浏览器上安装:并且提供多种平台下的解决方案比如mac,windows 二. 关于mac 使用 firebreath 开发浏览器插件 官方教程 http://www.firebreath.org/display/docume

mac 下vim 配置文件

" Configuration file for vim set modelines=0 " CVE-2007-2438 " Normally we use vim-extensions. If you want true vi-compatibility " remove change the following statements set nocompatible " Use Vim defaults instead of 100% vi compa