链轮 - 多个入口点？

Question

链轮官方文档清楚地说:

Sprockets takes any number of source files and preprocesses them
line-by-line in order to build a `single` concatenation.

我是Rails中链轮的忠实粉丝,但这就是问题 - 我的应用程序必须支持多种布局(桌面浏览器)和移动客户端(iphone,ipad,android手机等).

这两种布局都需要自己的HTML重置CSS规则.桌面和移动重置文件的连接规则会产生冲突,因为它们会覆盖低级CSS指令.

我该如何解决这个问题？

Answer 1

您可以通过为每个文件创建一个Sprocket文件来获取多个顶级CSS文件.例如,假设你想desktop.css被包含的reset.css,common.css以及ie.css与mobile.css被包含的common.css和ios.css.您将拥有以下文件:

• app/assets/stylesheets/desktop.css
• app/assets/stylesheets/mobile.css
• app/assets/stylesheets/reset.css
• app/assets/stylesheets/common.css
• app/assets/stylesheets/ie.css
• app/assets/stylesheets/ios.css

在desktop.css,您将拥有以下内容:

/*
 *= require reset.css
 *= require common.css
 *= require ie.css
 */

在mobile.css,您将拥有以下内容:

/*
 *= require common.css
 *= require ios.css
 */

然后,app/views/layouts/desktop.html.erb你会这样做

<%= stylesheet_link_tag :desktop, :debug => Rails.env.development? %>

并且类似地mobile.html.erb.

最后,您需要在以下位置设置预编译资产列表config/environments/production.rb:

config.assets.precompile = %w( desktop.css mobile.css )