Rails 4: assets not loading in production

Question

I'm trying to put my app into production and image and css asset paths aren't working.

Here's what I'm currently doing:

• Image assets live in /app/assets/images/image.jpg
• Stylesheets live in /app/assets/stylesheets/style.css
• In my layout, I reference the css file like this: <%= stylesheet_link_tag "styles", media: "all", "data-turbolinks-track" => true %>
• Before restarting unicorn, I run RAILS_ENV=production bundle exec rake assets:precompile and it succeeds and I see the fingerprinted files in the public/assets directory.

When I browse to my site, I get a 404 not found error for mysite.com/stylesheets/styles.css.

What am I doing wrong?

Update: In my layout, it looks like this:

<%= stylesheet_link_tag    "bootstrap.min", media: "all", "data-turbolinks-track" => true %>
<%= stylesheet_link_tag    "styles", media: "all", "data-turbolinks-track" => true %>
<%= javascript_include_tag "application", "data-turbolinks-track" => true %>

The generate source is this:

<link data-turbolinks-track="true" href="/stylesheets/bootstrap.min.css" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/stylesheets/styles.css" media="all" rel="stylesheet" />
<script data-turbolinks-track="true" src="/assets/application-0c647c942c6eff10ad92f1f2b0c64efe.js"></script>

Looks like Rails is not properly looking for the compiled css files. But it's very confusing why it's working correctly for javascripts (notice the /assets/****.js path).

Solution 1

In /config/environments/production.rb I had to add this:

Rails.application.config.assets.precompile += %w( *.js ^[^_]*.css *.css.erb )

The .js was getting precompiled already, but I added it anyway. The .css and .css.erb apparently don't happen automatically. The ^[^_] excludes partials from being compiled -- it's a regexp.

It's a little frustrating that the docs clearly state that asset pipeline IS enabled by default but doesn't clarify the fact that only applies to javascripts.

Solution 2

In rails 4 you need to make the changes below:

config.assets.compile = true
config.assets.precompile =  ['*.js', '*.css', '*.css.erb'] 

This works with me. use following command to pre-compile assets

RAILS_ENV=production bundle exec rake assets:precompile

Best of luck!

Solution 3

I just had the same problem and found this setting in config/environments/production.rb:

# Rails 4:
config.serve_static_assets = false

# Or for Rails 5:
config.public_file_server.enabled = false

Changing it to true got it working. It seems by default Rails expects you to have configured your front-end webserver to handle requests for files out of the public folder instead of proxying them to the Rails app. Perhaps you've done this for your javascript files but not your CSS stylesheets?

(See Rails 5 documentation). As noted in comments, with Rails 5 you may just set the RAILS_SERVE_STATIC_FILES environment variable, since the default setting is config.public_file_server.enabled = ENV['RAILS_SERVE_STATIC_FILES'].present?.

Solution 4

I was able to solve this problem by changing: config.assets.compile = false to
config.assets.compile = true in /config/environments/production.rb

Update (June 24, 2018): This method creates a security vulnerability if the version of Sprockets you're using is less than 2.12.5, 3.7.2, or 4.0.0.beta8

Solution 5

For Rails 5, you should enable the follow config code:

config.public_file_server.enabled = true

By default, Rails 5 ships with this line of config:

config.public_file_server.enabled = ENV['RAILS_SERVE_STATIC_FILES'].present?

Hence, you will need to set the environment variable RAILS_SERVE_STATIC_FILES to true.

View more solutions

Comments

[emersonthis]

I see the fingerprinted file in the /public/assets/ directory. In my layout, I have this: <%= stylesheet_link_tag "styles", media: "all", "data-turbolinks-track" => true %> Is this incorrect?`

[emersonthis]

For some reason, the production deployment is still pointing to the original files when I view the source <link data-turbolinks-track="true" href="/stylesheets/bootstrap.min.css" media="all" rel="stylesheet" /> But the the javascript files are correct! I don't understand why the same configurations work for .js files but not .css.

[Frederick Cheung]

You need to add styles.css to config.assets.precompile

[Benjamin Oakes]

Doesn't this mean that Rails is compiling the assets instead of, say, loading them from a CDN?

[Yanofsky]

@BenjaminOakes Yes, and that's what I wanted

[ahnbizcad]

I thought setting config.assets.compile to true will kill performance in production. also, css.erb? who uses that? and what about sass and coffee?

[Rameshwar Vyevhare]

when coffee and sass files are requested, they are processed by the processors provided by the coffee-script and sass-rails gems and then sent back to the browser as JavaScript and CSS respectively.

[Rameshwar Vyevhare]

"turbo-sprockets-rails3" gem to Speeds up your Rails 3 assets:precompile by only recompiling changed files, and only compiling once to generate all assets, this will answer your first question.

[Rameshwar Vyevhare]

This issue already solved for Rails 4 and so no need to use turbo-sprocket-rails3 gem

[ahnbizcad]

Sorry, I am not able to make the connection of what you said to answer my question.

[Rameshwar Vyevhare]

I agree with you but that issues can be overcome using turbo-sprocket-rails3 gem.

[MCB]

I think the config.assets.precomile = ... is unnecessary. Mine works fine without it and this # application.js, application.css, and all non-JS/CSS in app/assets folder are already added. is a generated comment in the production.rb file. I think adding to precompile is for additional assets.

[karlingen]

stackoverflow.com/questions/8821864/…

[Rameshwar Vyevhare]

I agree with you but in my case there are some files in .css.erb so i used this to make sure every files get precompiled.

[yekta]

DEPRECATION WARNING: The configuration option config.serve_static_assets has been renamed to config.serve_static_files to clarify its role (it merely enables serving everything in the public folder and is unrelated to the asset pipeline). The serve_static_assets alias will be removed in Rails 5.0. Please migrate your configuration files accordingly.

[yekta]

This mode uses more memory, performs more poorly than the default and is not recommended. Better to use an nginx proxy.

[xxjjnn]

as mentioned in other answers you need config.assets.precompile = ['*.js', '*.css', '*.css.erb'] and to run RAILS_ENV=production bundle exec rake assets:precompile

[IIllIIll]

Earlier when I was facing this problem changing that line had solved it for me, but now I'm facing it again (I don't know how I keep ending up in these situations.) and this isn't enough. Any more suggestions as to what might be wrong?

[GMA]

On Rails 5.0.0.beta3 I get this warning: DEPRECATION WARNING: serve_static_files is deprecated and will be removed in Rails 5.1. Please use public_file_server.enabled = true instead.

[Lucas Nelson]

This should be the accepted answer. Though it's config.serve_static_files in Rails 4.2 and config.public_file_server.enabled in Rails 5. @see github.com/heroku/rails_serve_static_assets/blob/master/lib/‌​…

[Châu Hồng Lĩnh]

Normally, when you run production server, you will run Rails with passenger or unicorn or puma behind Apache or nginx webserver. It is better to let Apache or nginx serve static files (js, css, images), and the Rails application server (puma, unicorn) serve Rails code and template. In order to do so, you should turn off config.serve_static_files, and configure alias in Apache and nginx to deal with assets.

[Rameshwar Vyevhare]

Yes I already turn off, if anyone precompile set while deploying then compile = true not required.there are few people has issue with specially complex application where lots of js and css files and also have some .erb extension they suffer as thier assets not precompiled properly or not loading properly may help them making some custom ways like above. after all I'm agree with you. web server has to perform serving static jobs thats the one of the reason why app server not perform fully web server's job.

[Adrian Moisa]

I had several issues crippling my CSS. In addition to this step I had to do some other tweaks. Read this answer if your issue still persists after precompile.

[James Tan]

why compile? we arent suppose to compile on production while its running

[James Tan]

this enable compilation of assets while live on production, very slow, not right

[tobinjim]

Rails 5.0.0.1 config/environments/production.rb contains config.public_file_server.enabled = ENV['RAILS_SERVE_STATIC_FILES'].present? so you can set this differently for your environment without changing code that's checked in to your SCM.

[bkunzi01]

NEVER DO THIS! Anyone setting config.assets.compile to true in production should be shot.

[Martin Velez]

For Rails 5, I should add, I set passenger_env_var RAILS_SERVE_STATIC_FILES true; in the location block of my app in my nginx.conf file.

[IvRRimUm]

@emersonthis Same! Js loads perfectly but some css files get 404. Did you resolve this?

[emersonthis]

It's almost ALWAYS a problem with asset pipeline configuration. If you have files in any location that isn't default, that's almost definitely the issue and you need to tell the asset pipeline about it using something like the first answer.

[Alfredo Osorio]

To enable it: "export RAILS_SERVE_STATIC_FILES=" then you run "rails s -e production" To disable it: "unset RAILS_SERVE_STATIC_FILES"

[Dr.Strangelove]

Why add build artefacts to the git though? You can just add rake task to your build process and avoid massive gitspam (especially if you have uglifier and gzipping on, which you should)

[BenKoshy]

@Dr.Strangelove Thank you for your comment - I don't know enough about that - : can you elaborate / edit the original post?