1

追記:
すみません。お恥ずかしいのですが、アセット周りを試し終えた結果、根本的にHTMLにミスがあることに気づきました。


app/assets/images/hoge.pngを置きました。

拡張子が.css.scssのファイルに、

background-image: image-url('hoge.png');

と記述し、ChromeのDeveloper Toolsで確認したところ

background-image: url(/assets/hoge-5c6df45c1cb3ef12bc11fb1dae8261db9737b142d46985f6a44ed1c0fbd62831.png);

/assets/hoge-フィンガープリント.pngという形になっており
フィンガープリントが付与されたファイル名の画像がそもそもないので取得できないのかと思いましたが、本来欲しいのは、app/assets/images/ ディレクトリなのでimages/ が足りないと思い、

background-image: image-url('images/hoge.png');

と書き換えたところ、今度はフィンガープリントが付与されず、加えて、images/ が2つも入ってしまいました。

background-image: url(/images/images/hoge.png);

仕方がないので、app/assets/hoge.pngにも同様にファイルを置いてみましたが、同様に表示されません。

そもそも.css.scssファイルもDeveloper Toolsで確認したところフィンガープリントが付与されたCSSファイルに変換されているようで、変換されたものをlinkタグでアクセスしにいっているようです(このCSSファイルはうまく読み込めている模様。なぜならbackground-colorを試しに指定したとき色はついたので)。

<link rel="stylesheet" media="all" href="foobar.self-3ca83820f3dd876e282a5295e5e27e4de51ac6a62b5bb8812844fbef484ca67f.css?body=1" data-turbolinks-track="true" />

正しいscssの書き方を教えて下さい。


追記:

development.rb

config.assets.debug = true
config.assets.digest = false

にしたところ、CSSやJSファイルへのダイジェストの付与はなくなりましたが、以前として、
background-image: url(/assets/hoge-ダイジェスト)
の状態でした。

development.rb

config.assets.debug = false
config.assets.digest = false

にすると、今までapp/assets/stylesheets配下に置いていたcss.scssファイルが勝手にCSSへ変換され、その変換されたファイルへのlinkタグが自動でERBに挿入されていましたのですが、linkタグが生成されなくなり、そもそもCSSへアクセスできなくなりました。

1 件の回答 1

1

development 環境で ダイジェストをオフにする を試してみてください

アセットパイプライン | Rails ガイド

2
  • CSSやJSファイル名へのダイジェストは消えましたが、依然としてbackground-image: url(/assets/hoge-ダイジェスト) と画像ファイル名はダイジェストが付与されています。 Commented 2015年12月15日 6:54
  • config.assets.debugとconfig.assets.digestの2つがあったんですね。両方試してみた結果を追記しました。 Commented 2015年12月15日 7:22

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。