23

我只是在学习 Rails 3.1 中的新资产管道。我遇到的一个特殊问题是 Sprockets 只是将所有找到的 CSS 样式表混合到一个庞大的样式表中。我理解为什么这比手动合并样式表和缩小生产更有利。但我希望能够有选择地级联样式表，而不是将所有规则都混在一起。例如，我想要：

大师.css

由 Rails 应用程序中的所有页面加载，但我想要

admin.css 仅由管理部分/命名空间中的页面/视图加载。

我怎样才能利用 Rails 3.1 结合样式表并将它们缩小以用于生产的好方法，同时又具有以前的灵活性，即每个布局只能加载某些样式表组合？

或者这应该通过在布局中向 body 标签添加一个类来完成 -

身体类="管理员"

然后根据需要定位样式规则。使用 SASS 范围选择器这可能是一个合理的解决方案。

4

5 回答 5

8

这就是我解决样式问题的方法：（请原谅 Haml）

%div{:id => "#{params[:controller].parameterize} #{params[:view]}"}
    = yield

这样我开始所有页面特定的.css.sass文件：

#post
  /* Controller specific code here */
  &#index
    /* View specific code here */
  &#new
  &#edit
  &#show

这样您就可以轻松避免任何冲突。

希望这对一些人有所帮助。

于 2011-05-29T15:52:13.663 回答
2

我在我的网站上有一篇关于此的文章： 利用 Rails 3.1、SCSS 和资产管道来区分您的样式表

并查看另一个问题的答案：Using Rails 3.1 assets pipeline to conditionally use certain css

希望这可以帮助。

最好的问候， 拉斯

于 2011-09-04T14:58:20.623 回答
1

@nathanvda：当然……

我们使用多个布局文件。所以在我们的 app/views/layouts 中，我们实际上忽略了应用程序布局并使用了 3 个自定义布局，而不是只有 application.html.haml（我们使用 HAML）：

admin.html.haml（仅限管理部分视图）

registered.html.haml（仅注册/登录用户视图）

unregistered.html.haml（仅在用户视图中未注册/未签名）

因此，在我的 admin.html.haml 文件的顶部，我将我的样式表链接标签指向一个单独的 admin.scss（我们使用 SCSS）清单。该清单将为管理部分加载任何必要的子样式表。这允许我们只为管理部分指定规则，同时还可以使用常见的样式。例如，我们在整个站点中使用 jquery-ui，因此与 jquery-ui 关联的样式位于它们自己的样式表中，我们将它们包含在所有 3 个 css 清单文件的清单中。

此解决方案不会为您提供一个可以缓存的 CSS 文件，但最终会为您提供 3 个 CSS 文件，每个都可以缓存。这允许在组织 CSS 规则时在性能和一些灵活性之间进行权衡，因此我们不必担心 CSS 规则冲突。

于 2011-08-25T11:30:43.473 回答
0

到目前为止，我一直在这样做的方式是有两个单独的文件夹 a/ 和 u/ 其中 a/ 用于管理视图， u/ 用于用户视图。然后在布局中，我使用 assets/u/application.css(js) 指向适当的 application.css。每次都必须移动自动生成的文件有点痛苦，但比必须在清单中单独要求每个文件要少得多。

于 2011-05-24T13:24:12.943 回答
0

我使用类似的东西

应用程序.html.erb ">

显示.html.erb

content_for :body_id 做 page_specific_body_id 结束

于 2011-06-28T17:00:00.277 回答