はじめに
備忘録で書いてるので間違いがあってもご容赦下さい。
むしろ指摘していただけると助かります。
環境
Rails 6.1.x
やりかた
対象となる背景画像を hogehoge.jpgとした場合
/app/assets/images/hogehoge.jpg のpathで配置する。
app/assets/stylesheets/application.scss に対してimage-urlを使う。
app/assets/stylesheets/application.scss
background-image: image-url('hogehoge.jpg');
こうすることで、
developmentでは app/assets/images 配下の対象ファイルを、
productionでは public/assets配下の「アセットパイプラインによってプリコンパイルされた対象ファイル」を取りに行く。
注意点
image-url は
app/assets/stylesheets/application.scss では動くが、
app/javascript/stylesheets/application.scss では期待している動作はしてくれないようだった。
（cssファイルでも不可）
また、背景画像を public/images 配下に配置してもdevelopmentでは表示されるはずだが、
ここに置いてある画像ファイルはproductionでアセットプリコンパイルされないので表示されないはずです。