Rails 4 vendor asset images not being referenced from css files Heroku and S3

Question

I have a lot of vendor images under Vendor folder referenced from vendor css files.

I am using Heroku and S3 for production and thing like background-image: url("../images/sprite.png"); is working in development but not in production as the image url points to S3 url.

It is not being precompiled either so not sure whether I should include this as part of precompilation of assets but I would like to stay away from this as I need to manually copy all image files across to assets/images folder and also change the reference in the css files by changing it to scss and also asset_url (which seems to be working fine)

Is there a way to not reference S3 url from vendor css files only

I'm also using asset_sync gem for uploading to S3

Answer 1

Precompile Assets

Seems that you're experiencing a problem with asset fingerprinting, and is an issue which can be resolved by precompiling your assets:

Heroku Tutorial on the subject:

#config/environments/production.rb
config.assets.compile = true
config.assets.digest = true

#cmd
rake assets:precompile RAILS_ENV=production
git add. 
git commit -a -m "Your Commit"
git push heroku master
heroku run rake assets:precompile --app your_heroku_app

This will precompile all your assets (and should sync them properly)

---

Asset Sync

Having used the asset_sync gem with Rails & Heroku, we've found you've got to run the precompile command on Heroku itself (the last step in my above points)

The only way to check is to look your Amazon bucket -- if it's set up correctly, it should populate with the assets if you precompile on Heroku