Fixing Missing Assets With Rails 4 on Heroku

Patrick Reagan, Former Development Director

Article Category: #Code

Posted on

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:

 Sprockets::Helpers::RailsHelper::AssetPaths::AssetNotPrecompiledError: 
 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'
 end

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


 # config/application.rb
 config.assets.precompile += [
 'hella-tite.css'
 ]

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

Related Articles