Ruby on Rails 5.1.4 CSS files not found it gives missing error. in browser's console and heroku logs

Question

I am using a themeforest by asbab. I've added them to my ruby on rails app. It works perfectly fine in localhost. But when uploaded to heroku, the css files are not found. It wont load all the css files.

Ruby : 2.4.0

Rails: 5.1.4

Heroku logs

2018-05-07T16:43:00.642798+00:00 heroku[router]: at=info method=GET path="/assets/header.css" host=printorbuy.herokuapp.com request_id=354f10c5-98e6-408a-811a-dac5b5a357f2 fwd="157.32.106.197" dyno=web.1 connect=0ms service=6ms status=404 bytes=1902 protocol=https
2018-05-07T16:43:00.169047+00:00 app[web.1]: [9a3e2628-2587-4ea2-bc24-fb43f88193f4]   
2018-05-07T16:43:00.169098+00:00 app[web.1]: [9a3e2628-2587-4ea2-bc24-fb43f88193f4] ActionController::RoutingError (No route matches [GET] "/assets/simple-line-icons.css"):

Answer 1

since all of the assets are masked before deployment check fingerprinting

thus, all of your css are fingerprinted for e.g.

/assets/plugins/animate.css

must have converted into something like

/assets/plugins/animate-908e25f4bf641868d8683022a5b62f54.css

similarly to all of the other css.

If you want to fix this, you have 2 options

1. disable the asset fingerprinting

   config.assets.digest = false  
   

   For more info refer http://guides.rubyonrails.org/asset_pipeline.html

2. use scss (its by default with ror), https://github.com/rails/sass-rails

   • change the file name home.css to home.scss
   • change all url('<file-name>') to asset-url('<file-name>')