Q&A前提・実現したいこと
ruby on rails 6.0.0でアプリケーション作成中です。
開発環境ではCSSに記述したbackground-imageが反映されたのですが、herokuへデプロイ後はbackground-imageのみ反映されていないためご教授頂けますでしょうか。
発生している問題・エラーメッセージ
herokuへデプロイ後はbackground-imageのみ反映されません image_tagで記述した画像は反映されています
該当のソースコード
HTML
ruby
1<header><%= render "shared/header" %> 2</header> 3<body> 4<section class="tweet-wrapper">
CSS
ruby
1.tweet-wrapper{ 2 width:100%; 3 background-image:url(lsize.jpg); 4 background-repeat:no-repeat; 5 background-size:cover; 6 background-position: center center; 7 background-attachment: fixed; 8}
試したこと
①
config/environments/production.rbに下記を追記
ruby
1config.assets.compile = true 2 config.serve_static_assets = true
②rake assets:precompile RAILS_ENV=production
③ git push heroku master
を行いましたが画像が反映されませんでした。
回答2件
0
css
1- background-image:url(lsize.jpg); 2+ background-image:image-url(lsize.jpg);
アセットパイプラインを使用する場合、最終的にアセットへのパスを変換する必要があります。このために、sass-rails gemは名前が-urlや-pathで終わる (Sass内ではハイフンですが、Rubyではアンダースコアで表します) 各種ヘルパーを提供しています。ヘルパーがサポートするアセットクラスは、画像、フォント、ビデオ、音声、JavaScript、stylesheetです。
image-url("rails.png")はurl(/assets/rails.png)に変換される
image-path("rails.png")は"/assets/rails.png"に変換される
参考：Railsガイド
投稿2020/10/20 05:40
総合スコア3365
0
自己解決
AWSのS3へ画像をアップしurlに記述する事で解決できました。
CSS
ruby
1background-image:url(S3へアップロードした画像のurlを記述);
投稿2020/10/20 06:59
総合スコア0
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/10/20 06:56 編集
2020/10/20 07:00
2020/10/20 07:12
2020/10/20 07:23 編集