Quantcast
Channel: CSSタグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 8582

【CSS】background-image: urlは本番環境では画像が映らない

$
0
0

これローカルでは映っていたけど、いざ本番環境で見てみると何も映っていない...って方絶対いると思うのでその方と備忘録として

何故本番環境では映らない?

これには海より深く山より高い...わけでもなく色々あってファイル名が変わっているからなんです。

何故ファイル名が変わるのか

RailsではデフォルトでAsset Pipelineのdigestと言う機能があるんですけど普段はいい奴なんです。調べてもらえればわかります。ただいい奴すぎてファイルを更新するごとにファイル名が変わっちゃうんです。
で、ファイル名が変わると言うことはurlの後ろに書いてた画像のパスが違ってくるんです。
簡単に言うとa.pngがa1.pngになっちゃう感じ。
これじゃあ指定してた画像持って来れねぇわ。

回避方法

もちろん回避方法は用意されていて結論から言うと

background-image: image-url(同じディレクトリなら画像のファイル名または画像のパス);
background: image-url(同じディレクトリなら画像のファイル名または画像のパス);

このどちらかで本番環境でも表示されるようになります。

もう一つ回避方法があってこちらは検証してないですが参考までに
もしかしたらMacだけかも

違う回避方法

$vim config/environments/production.rb
config/environments/production.rb
config.public_file_server.enabled=#beforeconfig.public_file_server.enabled=true#after

これでいけるみたいです。

ではこれにて


Viewing all articles
Browse latest Browse all 8582

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>