bokmann / font-awesome-rails

the font-awesome font bundled as an asset for the rails asset pipeline

Home Page:http://fortawesome.github.com/Font-Awesome/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Rails 4, font-awesome not appearing in production environment

ijdickinson opened this issue · comments

My app is running just fine in development mode, but when I cap deploy to my production environment (EC2, as it happens, though I'm not sure how significant that is), the app can't resolve the font-awesome font. I'm using pretty much as-installed rails environment configurations, and Capistrano recipes. Everything else in the app runs just fine, it's only the font-awesome font that can't be found.

I'm at a bit of a loss to know how to debug this, so any suggestions gratefully received. Relevant extracts from my Gemfile:

font-awesome-rails (4.0.3.0), 
rails (4.0.1)

Happy to provide any other details, but I don't which which ones are relevant and I don't want to waste folks' time by essentially posting the entire project!

Notes after finding and reading #65 :

  • I have restarted my production server
  • My gem is not in the assets group
  • I'm not using the fa_icon helper

Output from bundler as follows:

* bootstrap3-rails (3.0.1)
* capistrano-rails (1.1.0)
* codemirror-rails (3.16)
* font-awesome-rails (4.0.3.0)
* haml-rails (0.5.2)
* jquery-datatables-rails (1.12.2)
* jquery-rails (3.0.4)
* less-rails (2.4.2)
* minitest-rails (0.9.2)
* rails (4.0.1)
* sprockets-rails (2.0.1)
* underscore-rails (1.5.2)

When you precompile your assets, are you running it with RAILS_ENV=production?

rake assets:precompile RAILS_ENV=production

Also, please follow the Issue submission guidelines that we have. It will help us debug your issue a little better.

Thanks for your help. The Capistrano output shows:

INFO [a2facc83] Running bundle exec rake assets:precompile on aws-training-deploy
DEBUG [a2facc83] Command: cd /var/lib/rails/qlassroom/releases/20131223191547 && ( RAILS_ENV=production bundle exec rake assets:precompile )

So I think that, yes, I am running the asset precompilation in production mode.

I reviewed the issue submission guidelines, and as far as I can see I'm following them. Diagnostic steps 1-3 don't apply, as my app works in development mode, so it's not an application source code issue. I confirm I've checked steps 4-6. Output from step 7 is in the earlier comment.

Investigating this a bit more this morning, I think the core issue is that in production my app is not rooted at /. The development root URL is http://localhost:3000/, but the production root is http://<server>/qlassroom/. Nginx is configured to route all /qlassroom requests to Rails via Phusion Passenger. Capistrano is creating the font resources in the correct public/assets directory, but the includes that are being generated have a absolute URL:

/*!
 *  Font Awesome 4.0.3 by @davegandy - http://fontawesome.io - @fontawesome
 *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */
/* FONT PATH
 * -------------------------- */

@font-face {
  font-family: 'FontAwesome';
  src: url('/assets/fontawesome-webfont-0a8ef264981ae93cc2524d0585ca8318.eot');
  src: url('/assets/fontawesome-webfont-0a8ef264981ae93cc2524d0585ca8318.eot?#iefix') format('embedded-opentype'), url('/assets/fontawesome-webfont-5f3ff21ec2321ce7c1215146d3e7d38d.woff') format('woff'), url('/assets/fontawesome-webfont-46d92da2b5f999bb039c1af16b62c15a.ttf') format('truetype'), url('/assets/fontawesome-webfont-1b4427cb023ff18203bb9e8bb1e21a9b.svg#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

The HTTP get on /assets/fontawesome-webfont-0a8ef264981ae93cc2524d0585ca8318.eot should be either a relative URL assets/fontawesome... or should be rooted in the app base URL /qlassroom/assets/fontawesome....

Is there a configuration option I should be setting somewhere to generate the appropriate URLs?

This was the exact problem I was having, and it was because I was also deploying to an app which root was not at /

The fix for this was mindblowingly silly:
RAILS_ENV=production bundle exec rake assets:precompile RAILS_RELATIVE_URL_ROOT=/sub_url

I say it's silly because I already have this in my application.rb:
ENV['RAILS_RELATIVE_URL_ROOT'] = "/sub_url"

So majority of the assets were picking up the ENV, but the font-awesome-rails gem, and some other various aftermarket things were NOT prepending it to the lookup path.

I don't think it's a problem with the gem? But I just finally figured this out on 12/27 after fighting with this issue for like off and on for two weeks - so don't have too much more info, but just wanted to pass this along.

@Ephemerian and @superscott Thanks for the follow-up on this. This added info is really helpful.

I think it's safe to close this issue out, so I'm going to do that. If anyone wants to add a pull-request to add something about this to the readme, I'd be glad to pull that in too.

I can confirm that this solution works. I've put together some quick notes in pull request #76

commented

Yes, yes, yes! This issue has been driving me wonky. The solution was:
RAILS_ENV=production bundle exec rake assets:precompile RAILS_RELATIVE_URL_ROOT=/sub_url

Awesome. Thank you so much for posting this conversation publicly!

rake assets:precompile RAILS_ENV=production
works fine

rake assets:precompile RAILS_ENV=production
Also worked for me after many other tactics.

In my case had to do rake assets:clean then RAILS_ENV=production bundle exec rake assets:precompile and was all set. Just chiming in for posterity.

I have never needed to do this before and all Rails apps are running on the same server. Following font-awesome-rails README "Deploying to sub-folders" section fixed the "404 Not Found fontawesome-webfont..." issues on production server. This is for a Rails 5.1.4 application.