はじめに
現在オリジナルアプリの開発中です。Heroku環境でアプリをアップロードしているのですが、assetsに配置した画像が表示されないという問題がありました。解決方法がわかったのでまとめておきます。
問題
app/assets/images 配下に設置した画像が表示されない。(ローカル環境では表示されている)
ローカル環境では表示されているため、本番環境では追加の設定がいるのかもしれない。と思い調べると解決方法が出てきました。
解決方法
解決方法は image_tagのファイルの指定方法を修正することでした。
<%= image_tag "/assets/top.png" ,class:"img-fluid" %>
image_tagに渡す画像のバスの指定方法を間違えていました。
この書き方では、ローカルだと表示されるのですが、本番環境だと表示されません。
以下に修正しました。
<%= image_tag "top.png" ,class:"img-fluid" %>
結果無事に本番環境でも画像を表示する事ができました。
追記 以下の方法は間違いでした
最初自分が採用した以下の解決方法は間違いでした。(画像は表示されるけど推奨されない)
編集リクエストありがとうございます。
config.assets.compile = false
という記述があるので、
config.assets.compile = true
に変更するやり方です。
この方法でも画像を表示できるのですが、本番環境でのパフォーマンスに悪影響を及ぼすため推奨しないとのことです。
以下を参考にしました。
https://qiita.com/jnchito/items/3d225112a3ac95379b1d
まとめ
本番環境でのエラーだったため、最初何が原因か特定できなかったのですが、調べたらすぐに出てきました。
分からなくても焦らず、まずは冷静になる。→状況を整理する。→ググる
という習慣を身につけたいと思います。
また、解決方法にも様々あるので、精査できるようになりたいです。