- app/assets
- vendor/assets
- lib/assets
Manifest files
- app/assets/javascripts/application.js
- app/assets/stylesheets/application.css
- require
- include
- require_self
- require_directory
- require_tree
- depend_on
Search path
config.assets.paths << Rails.root.join("app", "flash", "assets")// this will load the app/assets/javascripts/library/foo.js //= require 'library/foo'
Gemified assets
Index files
Format handlers
Custom format handlers
Below is the handler class from the >Rabl gem, used to generate JSON using templates.
module ActionView module Template::Handlers class Rabl class_attribute :default_format self.default_format = Mime::JSON def self.call( template ) ommitted for clarity... end end end end
Post-Processing
In addition to pre-processing various formats into JavaScripts and stylesheets, the asset pipeline can also post-process the results. By default post-processing compressors are available for both stylesheets and JavaScripts.
Stylesheets
By default stylesheets are compressed using the YUI Compressor. You can control it by changing the config.assets.css_compressor configuration option, that is set to yui by default. When using Sass in a Rails project, one could set the CSS compressor to use Sass's standard compressor with the config.assets.css_compressor = :sass option.
Javascripts
There are several Javascript compression options available: :closure, :uglifier, and :yui, provided by closure-compiler, uglifier or yui-compressor gems respectively. The :uglifier option is the default, you can control it by changing the config.assets.js_compressor configuration option.
Custom Compressor
You can use a custom post-processor by defining a class with a compress method that accepts a string and assigning an instance of it to one of the configuration options above, like this:
class MyProcessor def compress(string) do something end end
config.assets.css_compressor = MyProcessor.new
Helpers
<%= stylesheet_link_tag "application" %> <%= javascript_include_tag "application" %>
By default, Rails only seeks to precompile assets named "application". If you have a good reason to break off additional bundles of assets, like for the admin section of your app, tell the pipeline to precompile those bundles by adding the names of the manifest files to the config.precompile array in config/application.rb.
config.assets.precompile += %w(admin.js optional.js}
Images
The venerable image_tag helper has been updated so that it knows to search asset/images and not just the public folder. It will also search through the paths specified in the config.assets.paths setting and any additional paths added by gems. If you’re passing user-supplied data to the image_tag helper, note that a blank or non-existant path will raise a server exception during processing of the template.
Getting the URL of an asset file
The asset_path and asset_url helpers can be used if you need to generate the URL of an asset. But you'd need to make sure to include the .erb file extension at the right-most position. For example, consider the following snippet of Javascript taken from a file named *transitions.js.erb * contains the line:
this.loadImage('<%= asset_path "noise.jpg" %>')
The asset pipeline runs the source through ERB processing first, and interpolates in the correct path to the desired JPG file.
Built-in SASS asset path helpers
Reusing a familiar pattern, image-url("rails.png") becomes url(/assets/rails.png) and image-path("rails.png") becomes "/assets/rails.png". The more generic form can also be used but the asset path and class must both be specified: asset-url("rails.png", image) becomes url(/assets/rails.png) and asset-path("rails.png",image) becomes "/assets/rails.png".
Data URIs
asset_data_uri
Fingerprinting
Fingerprinting makes the file name dependent on the files’ content, so that the filename only ever changes when the actual file content is changed.
Serving the files
To take full advantage of asset fingerprinting provided by the asset pipeline, you should configure your web server to set headers on your precompiled assets to a far-future expiration date. With cache headers in place,a client will only request an asset once until either the filename changes, or the cache has expired.
Below is one for Nginx:
location ~ ^/assets/ { expires 1y; add_header Cache-Control public; add_header Last-Modified ""; add_header ETag ""; break; }
The fingerprinting feature is controller by config.assets.digest Rails setting. By default it is only set in production environment.
Note that the asset pipeline always makes copies of non-fingerprinted asset file available in the same /assets directory.
While you’re thinking about how your asset files are being served, it’s worth investigating the possibility of seriously improving app performance by having your web server serve asset files directly instead of involving the Rails stack. Apache and Nginx support this option out of the box, and you enable it by turning on right option in production.rb:
config.action_dispatch.x_sendfile_head = 'X-Accel-Redirect' # for Nginx
Rake Tasks
When in production mode, Rails expects all manifests and asset files to be pre-compiled on disk and available to be served up by your web server out of the location specified in config.assets.prefix setting, which defaults to public/assets. Compiled asset files should not be versioned in source control, and the default .gitignore file for Rails includes a line for public/assets/*.
As part of deploying your application to production, you’ll call the following rake task to create compiled versions of your assets directly on the server:
$ RAILS_ENV=production bundle exec rake assets:precompile
Also note that local pre-compilation will result in a bunch of unwanted files in your /public/assets directory that will be served up instead of the originals. You’ll be scratching your head wondering why changes to your JS and CSS files are not being reflected in your browser. If that happens, you need to delete the compiled assets. Use the rake assets:clobber task to get rid of them.
