Fixing Missing Assets With Rails 4 on Heroku

I ran into a strange issue when deploying my Rails 4 application to Heroku's Cedar stack. Every time I pulled up the home page the content would display, but styles were completely missing. If I used heroku config:set to change both RAILS_ENV and RACK_ENV to development, assets would be served again as expected.

The Issue

As many people know, Rails 3 introduced the asset pipeline which requires all assets to be compiled in production environments. If an asset is referenced by the markup (through javascript_include_tag, stylesheet_link_tag, or their pure HTML equivalents) a precompiled asset must exist in public/assets. If an asset is referenced but is not precompiled, the application will typically respond with a 500 error:

 hella-tite.css isn't precompiled

My problem was twofold:

  1. The application was using a stylesheet other than the default application.css
  2. This file had not been precompiled

Setting the environment to development just masked the issue by compiling assets on the fly — not a good idea for a production environment.

Making it Work

In this case, identifying the problem was the hard part — the fix is easy. Make sure you're using the rails_12factor gem (for logging and asset serving):

 # Gemfile
 group :production do
 gem 'rails_12factor'

Then add the asset(s) to the precompilation list:

 # config/application.rb
 config.assets.precompile += [

Deploying the application after these changes will now serve up the correct stylesheet.

Sign up for The Viget Newsletter

Nobody likes popups, so we waited until now to recommend our newsletter, a curated periodical featuring thoughts, opinions, and tools for building a better digital world. Read the current issue.