Railsのscssで画像のパスを指定できていなかった話

やりたかったこと

li要素の「・」を自前の画像に変えてサイズを調整したかった

うまくいかなかったこと

いくら画像を指定してもliの・が自前の画像に変更されない。

試したこと

cssでliの・を画像に変更する方法をググって以下の方法を試した

background-image:url("画像ファイルの相対パス")
background-repeat: no-repeat;
background-size: 20px;
background-position:left center;

liの・を画像に変えることは可能だが、それだと画像サイズの変更ができないためliの背景画像として表示させた。(かった)

解決

原因は画像ファイルをCSSのurl関数にscssファイルからの相対パスで指定していたこと。
scssはそのままcssとして読み込まれるのではなくコンパイルされてcssになる様なのでこの書き方だと画像が見つからない(エラーも出なかったので気づかなかった)
正しい書き方はこう railsのヘルパーメソッドimage-urlを使う

background-image: image-url("ファイル名");

image-urlはrailsでsample_pjというプロジェクトであれば
sample_pj/app/assest/image配下のファイルを探してくれる。
images直下のsample1.pngという画像を出したい場合はこう

background-image: image-url("sample1.png");

images直下にsharedというディレクトリがありその中のsample2.pngを表示させたい場合はこう

background-image: image-url("shared/sample2.png");

最後に

cssとscssの違いをなんとなーくいけるだろでやっていたためパスが変わることなど全く頭になかったので長時間のつまづき。よく考えてみたらhtml.erbで表示させる時もimage_tagというrailsのメソッド使ってたなーと。