Using the asset pipeline with filegroups

Question

The Rails docs for the asset pipeline say:

The default behavior in Rails 3.1 onwards is to merge all files into one main file for JS and CSS. However, you can individual files or groups of files if required (see below)

How exactly do you split files into groups as indicated? For example, if I have an application that also has an administration area, I would like to create three compiled files:

shared.css (for both front-end and end-users)
application.css (only for interfaces)
admin.css (desktop only)

By default, all my files in application.css are combined.

Answer 1

Apparently, my understanding of reading is completely absent (tl; dr). It seems that when you use

stylesheet_link_tag 'application' 

I am looking at the application / assets / stylesheets / application (css | sass) for a manifest file that determines which sheets to include.

So i can just use

 stylesheet_link_tag 'admin' 

In my back-end look for this manifest. So here is how my asset structure ends:

 /app /assets /stylesheets admin.css application.css /admin screen.css /application screen.css /shared layout.sass reset.css typography.sass 

admin.css and application.css are my manifests, and they look like this:

 /** admin.css *= require_self *= require shared/reset *= require shared/layout *= require shared/typography *= require admin/screen */ /** application.css *= require_self *= require shared/reset *= require shared/layout *= require shared/typography *= require application/screen */ 

You can see that each of them simply refers to shared sheets, and then requires a context sheet.

Answer 2

You will need to create a manifest for each area. For instance:

admin.css:

 /* *= require shared/nomalize *= require shared/960.css *= require admin/base *= require admin/tables */ 

shared.css:

 /* *= require shared/nomalize *= require shared/960.css *= require public/base *= require public/branding */ 

You can create folders for storing shared, public, and administrative CSS and require them as needed. You will need to remove the require_tree directives from any manifest

Describe them in your layouts:

 <%= stylesheet_link_tag "application" %> <%= stylesheet_link_tag "admin" %> 

and add additional manifests to the precompilation array:

 config.assets.precompile += ['admin.js', 'admin.css']