Rails 3.1 introduced a feature called the asset pipeline. Among other things, it allows developers to be efficient by separating their code into smaller, more manageable files, while simultaneously reducing HTTP requests in the browser and thus improving website/web app performance, by having only one file—the manifest file.
What is a manifest file?
Adding files to the manifest
There are a few ways to add files to the manifest. One, by using the “require_tree” directive; another, by listing specific files.
//= require jquery //= require jquery_ujs //= require "jquery_functions" //= require_tree . //= require_tree ./common
A note about require_tree
For CSS files, the implementation is the same, but the syntax of the manifest file is a little different:
*= require_self *= require "styles" *= require_tree ./common
The example above shows different ways to include files into the CSS manifest. I would caution against ever using “require_tree .” (including ALL files) with CSS, as the order of files is very important. When working with SASS files and partials, those partials should be included with @import directives in the .scss/.sass files themselves, and not in the manifest.
Now we know how to include files into the manifest. Next, we will link to the manifest file(s) in our layout.
<%= stylesheet_link_tag 'all' %>
But what if you want to include files only for old versions of Internet Explorer?
In this case, we don’t want to include in our manifest the files that specifically apply to making these browsers behave. My solution: make subdirectories and manifest files, declare the new manifest files, include the new manifest files with IE conditional comments in the head of your layout. I’ll explain further.
Make subdirectories and manifest files
Declare new manifest files
//= require_tree ./ie
And your CSS directive:
*= require_self *= require_tree ./ie
# Enable the asset pipeline config.assets.enabled = true config.assets.precompile += %w( ie.js ie.css )
Include the manifest files with IE conditional comments in your layout
The last step is calling these new files in the of your layout:
... all the other stuff ... <!--[if lt IE 9]> <%= stylesheet_link_tag 'all' %> <![endif]-->
This seems to be the least painful method of implementation. We could easily forego the directories and list files out individually, but why, when we can still take advantage of the streamlined process the asset pipeline has to offer?
This is certainly not the only solution. We would love to hear your thoughts on how you include individual files within a Rails project using the asset pipeline that don’t fit in the manifest.