Glyphicon not showing in Heroku(it was normal before)

Question

I have a rails 4 application and everything was working fine, until now, instead of the bootstrap glyphicon it appears only a square! I don't know why, I didn't change anything... I want a solution DIFFERENT FROM `changing config.assets.precompile = true, once it is not a good practice and your application will run slowly if you do it.(See config.assets.compile=true in Rails production, why not?). Thanks!

Answer 1

Osni, let me explain the issue for you.

--

Asset Precompilation

Heroku precompiles your Rails assets, meaning you need to ensure all the assets are "precompile-proof" before you push them. What I mean by this is when you precompile your assets, Rails fingerprints them (adds hashed value to the end of the filename).

This means that although you may be referencing your assets by their "static" name, your app will not be able to load them as they will have a different name. This is one of the main reasons why fonts don't work on Heroku for a lot of people.

When you have custom assets in your stylesheets (such as fonts), you need to ensure several things:

1. The assets are referenced correctly inside the stylesheet (use SASS)
2. The assets precompile correctly when deployed to Heroku

I would recommend doing the following:

---

SASS

Firstly, make sure you reference any dependencies using the Rails asset path helpers (asset_path / asset_url):

#app/stylesheets/application.css.scss
.test { background: asset_url("your_background_image.png") }

This allows you to set the relative file paths, for when you do use precompilation. It's the same with your fonts (check my answer); however, you may not have the issue as you're using bootstrap ;)

--

Precompile

When you precompile your assets, you just need to run:

$ rake assets:precompile RAILS_ENV=production

This will take your asset files in the asset pipeline, and allow you to use them in your production application on Heroku with no issue

Answer 2

Because you didn't compile your assets locally, heroku tried to compile them but it failed. That is called slug compilation.

The solution is to compile your files locally, and commit the public/assets folder. To do that you need to run:

RAILS_ENV=production bundle exec rake assets:precompile

Why heroku failed compiling your assets? It could be because it detected a manifest file into your assets folder, and it assumed that you compiled your assets manually.

Answer 3

This is what worked for me.

application.css.scss

@import "bootstrap-sprockets";
@import "bootstrap";