ruby-on-rails-3 - Rails 3.1/Compass/sprockets - 生成 css 两次

Question

使用 github 版本的 compass rails31 分支和 sass-rails：

gem "sass-rails", :git => "https://github.com/rails/sass-rails.git"
gem "compass", :git => "https://github.com/chriseppstein/compass.git", :branch => "rails31"

我创建了一个部分 (_base.css.scss)，其中包含蓝图/重置和蓝图排版的导入。我还有一个 screen.css.scss 文件，其中包含我的基本部分。

当 rails 将它编译到 application.css 中时，我看到我的重置和排版 css 两次。

样式表/application.css.scss

/*
 * This is a manifest file that'll automatically include all the stylesheets available in this directory
 * and any sub-directories. You're free to add application-wide styles to this file and they'll appear at
 * the top of the compiled file, but it's generally better to create a new file per style scope.
 *= require_self
 *= require_tree .
*/

样式表/partials/_base.css.scss

@import "blueprint/reset";
@import "blueprint/typography";

@include blueprint-typography;

样式表/部分/screen.css.scss

@import "partials/_base";

#container { @include container; }

我真的不明白这里发生了什么，以及开始使用 compass 和 rails 3.1 的正确配置是什么

非常感谢您的指导！

score 2 · Accepted Answer

如果您正在使用

require_tree .

在您的 application.css 清单中，它将自动包含包含该文件的目录中的所有文件。

在 application.css 清单中尝试以下方法，而不是使用 @import：

/*
  *= require blueprint/src/reset
  *= require blueprint/src/typography 
  *= require_self
  *= require_tree . 
*/

此外，您可能希望将蓝图放入 vendor/assets/stylesheets 而不是 app/vendor （应包含应用程序特定代码）

score 1 · Accepted Answer

这是我的解决方案，它可能不是应该做的方式，（我真的不知道如何使用链轮）但它似乎工作......如果有更好的方法来实现这一点，请告诉我。

应用程序.css.scss

/*
 * This is a manifest file that'll automatically include all the stylesheets available in this directory
 * and any sub-directories. You're free to add application-wide styles to this file and they'll appear at
 * the top of the compiled file, but it's generally better to create a new file per style scope.
 *= require_self
 *= require_tree .
*/

@import "blueprint/reset";
@import "blueprint/typography";

@include blueprint-typography;

屏幕.css.scss

@import "blueprint";
@import "partials/_base";

#container { @include container; }

_base.css.scss

# Columns or colors variables goes here...

score 0 · Accepted Answer

这可能不是您的情况，但 css 加载两次的原因之一是您在 @import 语句中放置了文件扩展名（例如，.css）。