logo标签列表

Compass对于Rails 3.1有什么价值？

ruby-on-rails-3sassruby-on-rails-3.1blueprint-csscompass-sass
28

我正在决定在启动一个新的Rails 3.1项目时是否应该包括Compass。我以前没有使用过Compass。

Rails 3.1现在直接支持SCSS。通过Sprockets，Rails 3.1资源管道现在会自动编译样式表。此外，我可以直接使用CSS框架（如Blueprint）的SCSS版本。

如果在Rails 3.1中使用Compass，我将获得哪些好处？

4
在Compass邮件列表中，Wynn Netherland回答了这个问题：“Compass相当于Rails中的Sass。Compass为Sass提供模式和最佳实践，如CSS3、资产URL帮助程序等，而不仅仅是网格框架。” - Daniel Kehoe
8
我认为他的意思是，Compass 对 Sass 就像 Rails 对 Ruby 一样（至少如果我的 SAT 记忆没错的话）。 - Chris Nicola
4个回答
20

Compass提供了很多好的mixin，一个相当强大的雪碧图生成器以及与Blueprint的紧密集成，这意味着您不必在整个HTML中使用非语义的col类。如果您不使用mixin，则使用Compass没有太多好处，但是如果您不使用它们（嵌套和变量很好，但mixin可以帮助将特定于浏览器的属性实现集中到单个位置）也没有太多好处。

然而，我发现Blueprint比它的价值更麻烦。我仍然会为mixin使用Compass，但是目前Rails 3.1与Compass之间的兼容性非常糟糕（您必须通过一些技巧，然后您仍然牺牲一些功能）。

在某种相关的说明中，Rails 3.1编译资产的方式相当“有缺陷”。它没有考虑社区过去一两年如何使用Sass - 将变量，mixin和页面部分保持分离以便由主文件包含。 Sprockets“自动”加载和编译Sass的方式使文件彼此脱节，因此即使您在application.css文件中手动定义加载顺序，您在文件中设置的变量也无法在随后加载的文件中使用。

1
感谢您对当前Rails 3.1问题的警告。看起来Compass精灵生成器和混合物仍然有价值。是否有替代Blueprint的CSS重置和语义化命名类？ - Daniel Kehoe
1
关于语义化CSS框架，我不这么认为。不同之处在于，对于命名为“span-3 prepend-2”的类应用样式，您将菜单包装在<nav>标签中并直接应用样式。当您需要一个ID或类时，您会适当地命名它，例如“.user”或“#showreel”。Compass通过Mixins (body > div { @include container; } nav { @include col(3); @include prepend(2); }) 让你可以使用Blueprint进行此操作。个人而言，我不喜欢这样做，但它比在HTML中添加布局类要好得多。 #i_am_a_snob - coreyward
1
我倾向于使用Eric Myers的CSS重置版本，然后在此基础上构建。直到最近，我一直在使用自己的 mixins，但现在开始使用Compass mixins。至于布局相关的CSS，我仍然自己编写。除非你正在进行基于网格的设计（或者像WordPress主题这样必须非常灵活的设计），否则使用css网格框架太快、太容易了。 - coreyward
1
读者应该注意，本答案与 Rails 3.1 的预发布版本有关。Rails 3.1 的最新候选版本已经修复了使用 partials 的 Sprockets 问题。我认为可以安全地假设一旦 3.1 正式发布，它将能够正常工作。 - nocache
14

Bourbon（由Thoughtbot开发）是一个轻量级的代替Compass的工具，很好地集成了Rails 3.1。

Bourbon拥有Compass主要的CSS3 mixin功能（背景图像、盒阴影、边框半径、渐变等）。它还提供了按钮样式、布局网格化以及其他一些实用功能。

你可能会错过Compass的某些高级特性，但这可以通过Sass的强大功能轻松解决：只需复制或创建自己的mixin即可！

升级我的Rails应用程序时，Compass经常让我头疼。我很欣赏Bourbon的简洁性（尽管它也可能会让你在早上头疼...）

3
波旁威士忌和Rails 3.1对我来说很合适。比尝试使用Compass做所有事情有更好的关注点分离。 - Daniel Kehoe
1

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

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

附注：

Rails 3.1处理.scss文件的方式是逐个处理 - 例如，如果您在一个文件中定义变量，则它们不会传递到其他.scss文件中。我认为这不是最优解决方案。

1
Blueprint是一种设计无关的CSS框架，我不需要Compass来直接安装它作为Rails 3.1中的SCSS文件。 - Daniel Kehoe
1

html5boilerplate的罗盘插件也是一个很好的时间节省器，因此出于这些原因，我会使用罗盘。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接