Background image not showing up in heroku

Question

I'm having issues with the background image for my heroku site, locally using

background-image: url('background_stripe.png');

works but when deployed the file is broken

I've tried using

background-image: image-url('background_stripe.png');
background-image: url(image-url('background_stripe.png'));
background-image: url(image_url('background_stripe.png'));

none of which worked locally or on heroku.

Using bash I've found out heroku has named the image file background_stripe.png but it has no hash and its a broken image

Answer 1

In your production.rb add the following line

config.serve_static_assets = true
config.assets.compile = true

or you can try to precompile the assets locally using

RAILS_ENV=production rake assets:precompile

Answer 2

When your assets get compiled for production, they get a 'digest' added to the end of them for versioning purposes. You should use asset_path('background_stripe.png') if you're defining the class in your views or image-url('background_stripe.png') if you're defining them in your SCSS files as referenced in the docs.