Compass for Rails 3.1 的价值是什么？答案

【问题标题】：What is the value of Compass for Rails 3.1?Compass for Rails 3.1 的价值是什么？
【发布时间】：2011-09-12 19:10:49
【问题描述】：

我正在尝试决定在开始一个新的 Rails 3.1 项目时是否应该包含 Compass。我以前没用过 Compass。

Rails 3.1 现在直接支持 SCSS。 Rails 3.1 资产管道（通过 sprockets）现在可以自动编译样式表。而且我可以直接使用 CSS 框架的 SCSS 版本，例如 Blueprint。

在 Rails 3.1 中使用 Compass 有什么好处？

【问题讨论】：

在 Compass 邮件列表中，Wynn Netherland 回答了这个问题：“Compass 之于 Rails 就像 Sass 之于 Ruby。Compass 为 CSS3、资产 url 帮助程序等内容打包了 Sass 的模式和最佳实践，而不仅仅是网格框架。”
我认为他的意思是 Compass 之于 Sass 就像 Rails 之于 Ruby（至少如果我对 SAT 的记忆是正确的）

标签： ruby-on-rails-3 sass ruby-on-rails-3.1 blueprint-css compass-sass

【解决方案1】：

Bourbon（由 Thoughtbot 提供）是与 rails 3.1 完美集成的指南针的轻量级替代品。

它具有您使用指南针获得的主要 css3 混合（背景图像、框阴影、边框半径、渐变......）。它还具有帮助设置按钮样式、“网格化”您的布局以及更多好东西。

您可能会错过 compass 的一些强大功能，但可以通过 sass 的强大功能轻松克服：只需复制/创建您自己的 mixin！

在升级我的 rails 应用程序时，Compass 经常让我头疼。我很欣赏波旁威士忌的简单性（尽管它也可能让你头疼......早上:-)）

【讨论】：

Bourbon and Rails 3.1 对我来说是正确的。比尝试用 Compass 做所有事情更好地分离关注点。

【解决方案2】：

html5boilerplate compass 插件也非常节省时间，因此我会使用 compass

【讨论】：

【解决方案3】：

Compass 提供了许多优秀的 mixin、一个非常强大的精灵生成器以及与 Blueprint 的紧密集成，这意味着您不必在整个 HTML 中使用非语义的 col 类。

如果你不使用 mixins，使用 Compass 并没有太多好处，但是如果你不使用 SCSS，使用它们也没有太多好处（嵌套和变量很好，但 mixins 有助于保持单个位置中特定于浏览器的属性实现）。

但是，我发现蓝图比它的价值更麻烦。我仍然会使用 Compass 作为 mixins，但是现在 Rails 3.1 和 Compass 之间的兼容性很糟糕（你必须跳过一些障碍，你仍然会牺牲一些功能）。

在一些相关的注释中，Rails 3.1 编译资产的方式相当“破碎”。它没有考虑社区在过去一两年中是如何使用 Sass 的——将变量、mixin 和页面部分都分开，以便按顺序包含在主文件中。 Sprockets 加载和编译 Sass 的“自动”方式将文件彼此分离，因此即使您在 application.css 中手动定义加载顺序，您在文件中设置的变量也无法用于后续加载的文件。

【讨论】：

感谢您对当前 Rails 3.1 问题提出警告。似乎 Compass sprite 生成器和 mixins 具有持续的价值。是否有提供 CSS 重置和语义命名类的蓝图替代方案？
Re：语义 CSS 框架，我不这么认为。不同之处在于将样式应用于名为“span-3 prepend-2”的类，您将菜单包装在<nav> 标记中并直接将样式应用于该类。当您需要一个 ID 或类时，您可以适当地命名它，例如“.user”或“#showreel”。 Compass 让您通过 Mixins 使用 Blueprint 执行此操作 (body > div { @include container; } nav { @include col(3); @include prepend(2); }。我个人不喜欢它，但它比在 HTML 中乱扔布局类要好得多。#i_am_a_snob
我倾向于使用 Eric Myers 的 (sp?) CSS 重置版本，然后在此基础上进行构建。直到最近我都使用了我自己的 mixin，但我已经开始使用 Compass mixins。我仍然自己做所有与布局相关的 CSS。没有 css 网格框架就太快太容易了，除非你正在做一个非常基于网格的设计（或者必须非常灵活的东西，比如 Wordpress 主题 [颤抖]）。
读者应该注意，这个答案与 Rails 3.1 的预发布版本有关。Rails 3.1 的最新候选版本已经修复了包含部分的 Sprockets 问题。我认为可以安全地假设一旦 3.1 实际发布，它就会很好地工作。

【解决方案4】：

Compass 是一个与设计无关的框架 - 例如。您不必担心用户使用哪些浏览器。

例如Compass 有附加组件，例如 CSS3 跨浏览器功能： http://compass-style.org/reference/compass/css3/ 这样您就可以在 .scss 文件中指定与浏览器无关的内容

旁注：

Rails 3.1 处理 .scss 文件的方式是一次一个 - 例如如果您在一个文件中定义变量，它们不会被转移到其他 .scss 文件中。恕我直言，这并不是真正的最佳解决方案。

【讨论】：

Blueprint 是一个与设计无关的 CSS 框架，我不需要 Compass 直接将其安装为 Rails 3.1 的 SCSS 文件。