piñones - ¿puntos de entrada múltiples?

Question

Sprockets official documentation dice claramente que:

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

Soy un gran fan de las ruedas dentadas en los carriles, pero aquí está el problema - mi solicitud tiene que soportar múltiples diseños (navegadores de escritorio) y clientes móviles (iPhone, iPad, teléfonos android etc.)

Ambos diseños requieren sus propias reglas CSS de restablecimiento de HTML. Las reglas concatenadas de los archivos de restablecimiento de escritorio & de escritorio provocarían un conflicto porque anulan las directivas de bajo nivel de CSS.

¿Cómo puedo solucionar eso?

Answer 1

Supongo que ya tiene diseños diferentes para cada dispositivo o grupo de dispositivos. Si es así, solo incluya un archivo css de nivel superior diferente en cada uno, luego tenga diferentes declaraciones de requisitos en esos archivos de nivel superior. Si está utilizando Rails 3.1, no hay razón para que tenga que mantener la línea incorporada que incluye todos los archivos css.

Answer 2

No estoy muy seguro de si los piñones admiten esto, pero sé que si usa la gema Jammit. Puede configurar diferentes paquetes, cada uno con su propio cóctel de sus archivos JS o css. p.ej. tener un: paquete de espacio de trabajo para escritorio y y: paquete móvil para móviles. Está todo definido en un archivo de configuración YAML y se concat en el orden en que se especifican, lo que puede ayudar a que las dependencias de plugins correcta etc.

javascripts: 
    workspace: 
    - public/javascripts/vendor/jquery.js 
    - public/javascripts/lib/*.js 
    - public/javascripts/views/**/*.js 
    - app/views/workspace/*.jst 

    mobile: 
    - public/javascripts/vendor/jquery.js 
    - public/javascripts/lib/mobile.js 


stylesheets: 
    common: 
    - public/stylesheets/reset.css 
    - public/stylesheets/widgets/*.css 
    workspace: 
    - public/stylesheets/pages/workspace.css 
    mobile: 
    - public/stylesheets/pages/mobile.css 

Jammit podría valer la pena un vistazo para sus necesidades

Espero que esto ayude.

Answer 3

Puede obtener múltiples archivos CSS de nivel superior haciendo un archivo Sprocket para cada uno. Por ejemplo, supongamos que quiere que desktop.css esté compuesto por reset.css, common.css y ie.css y mobile.css que se compone de common.css y ios.css. Se podría tener los siguientes archivos:

• 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

En desktop.css, que tendría los siguientes:

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

En mobile.css, que tendría el siguiente:

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

Luego, en app/views/layouts/desktop.html.erb, que haría

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

y lo mismo para mobile.html.erb .

Por último, tendrá que configurar la lista de activos precompilado en config/environments/production.rb:

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