最新消息:2014,为梦想加油,专注于前端开发!

compass安装与webstorm

未分类 admin 711浏览 0评论

国内容易补墙,替代方案

gem source –remove https://rubygems.org/
gem source –add http://ruby.taobao.org/
gem install compass -V

webstorm下配置compass

结合Webstorm和Compass,完成自动编译Scss文件为css,做个简单的记录。

1 首先用 webstorm 打开创建的 compass 项目,然后依次选择:

File->Settings->File Watchers

点击右边的加号,选择 Compass SCSS 添加一个 watcher :

2 在Program里面选择 ruby 安装路径的 bin 下面的 compass.bat , Arguments 目录填入 compile $UnixSeparators($FilePath$)$ ,Working directory填入 $UnixSeparators($FileParentDir$)$ ,Output paths to refresh留空,保存之后就配置完成了。我的设置看起来是这样的:

如果你的项目不是在根目录的话, Working directory 配置为 $UnixSeparators($FileParentDir$)$ ,或者就直接把 Working directory 配置为 $UnixSeparators($FileParentDir$)$ 吧。

http://www.tuicool.com/articles/YzYBNbf

当你引用compass的内建库如 @import “compass/css3″ 时,webstorm会给你报错,这是你需要进行下面的操作。

setting -> Languages && Frameworks -> Compass

记得 应用 和 保存。

如果你想在在谷歌中直接看到 xxx.scss 而不是编译后的css , 需要进行下面的配置。

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

对 config.rb 中 添加 sourcemap = true

http://jingyan.baidu.com/article/fa4125acde99f928ac7092a9.html

转载请注明:专注于web前端开发 » compass安装与webstorm

发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址