【簡単】RailsでCSS(スタイルシート)を読み込む方法とCSSが反映されないときの解決策

Ruby on Rails で CSSを読み込む方法を解説します。production 環境では、CSSファイルを配置するだけでは反映がされません。その問題と解決策です。

ヤフーニュースと窓の杜で無料VTuberアプリ『メイアライブ』が紹介されました。

スタイルシートのCSSファイル(例: custom.css)を、app/assets/stylesheets 配下に置きます。

ビューファイルに下記のように書きます。

<%= stylesheet_link_tag "custom", :media => "all" %>

production環境では、CSSの更新を反映させるためにプリコンパイルをする必要があります。これを忘れると、「CSSファイルを更新したのに新しいCSSが反映されないという問題」が起こります。

ターミナルで下記のコマンドを実行します。

rake assets:precompile

もしくは、

rake assets:precompile:all

これで、CSSがproduction環境でも反映されるようになります。サーバサイドで上記を行なってもブラウザから反映を確認できない場合は、ブラウザキャッシュもクリアしてみて下さい。