Rails5 の css で画像を設定する
Ruby Ruby on Rails
Published: 2019-06-11

やったこと

Rails5 の css で画像を設定します。

今回 production 環境で試します。

確認環境

$ ruby --version
ruby 2.6.3p62 (2019-04-16 revision 67580) [x86_64-darwin17]

$ rails --version
Rails 5.2.3

調査

画像を下記に配置します

app/assets/images/sample.png

app/views/tasks/new.html.erb

<div id="main">
  dddd
</div>

app/assets/stylesheets/tasks.scss

#main {
  background-image: image-url('sample.png')
}

config/environments/production.rb

# config.public_file_server.enabled = ENV['RAILS_SERVE_STATIC_FILES'].present?
config.public_file_server.enabled = true

↑ Webサーバから静的ファイルを読み込むことができるようにします。

$ RAILS_ENV=production bin/rails assets:precompile

↑ プリコンパイルして、ファイルを作成します。

参考