Compass安装步骤

在SASS(http://sass-lang.com)和compass(http://compass-style.org)官网可以找到很多学习资料
但是其中有些下载链接在国内不能用,下面总结一个简单的安装步骤,(在《SASS、COMPASS 安装指南》的基础上稍作修改)

安装ruby

SASS 需要运行在 Ruby 下,进入这个页面,下载最新版本的 rubyinstaller,一路 Next 完成安装。

安装 SASS 和 COMPASS
在开始菜单中找到 “Ruby 1.9.3-p0 -> Start Command Prompt with Ruby”并运行。
输入命令:gem install compass
该命令会自动下载和安装 COMPASS 及其依赖模块(包括 SASS)

Compass安装步骤_第1张图片

使用
创建一个 COMPASS 项目
在命令行中切换到你需要创建项目的目录,运行:
compass create <projectname>

这个命令会创建一个包含一系列文件的目录,其中最重要的是配置文件 config.rb,其他文件如果你不需要都可以删除。
在 config.rb 中你可以修改 SASS 和 CSS 的目录及其它一些基础设置。

实时编译 SASS 文件
COMPASS 提供的默认方法是:

在命令行下切换到项目目录,运行

compass watch
COMPASS 将会实时监控 SASS 目录的文件变化,只要你一保存文件,立即将相应文件编译为 CSS 文件。


还有人做了一个图形化界面compass.app,可以让你舍弃烦人的命令行,执行compass常用命令更加方便。>>这里下载<<


让 Firebug 里显示 SASS 行号
既然现在用 SASS 来开发,我们就需要浏览器开发工具中显示样式对应的 SASS 行号而不是 CSS 行号了。
如果你使用 Firebug 可以安装 FireSass 来解决这个问题。
首先修改 SASS 的配置文件让其在 CSS 文件中输出调试信息,打开项目目录下的 config.rb,添加一行并保存
sass_options = {:debug_info => true}
如果你在 watch,结束掉重新运行配置的修改才会生效。
然后下载安装 FireSass 后就能看到 Sass 行号了。

Compass安装步骤_第2张图片

你可能感兴趣的:(css,浏览器,Firebug,command,Ruby,开发工具)