【Rails】Webpacker管理のCSSがHerokuで反映されない場合の対処

2020年7月30日 15:51

はじめに

Rails6から標準導入されたWebpacker(Webpack for Rails)でCSSを管理しているRailsアプリのCSSが、ローカル開発環境では反映されていたのに、デプロイ先のHerokuでは反映されないという事象がありました。

対処

app/views/layouts/application.html.erbを以下のように修正します。

# 修正前
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>

   ↓

# 修正後
<%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>

ローカル開発環境では反映されていた理由

すみません、調べたんですがわかりませんでした。

一説によると、ローカル開発環境にはwebpack-dev-serverがあるかららしいんですが、詳しいことはわかりませんでした。

以下の質問に対する答えにwebpack-dev-serverに関する言及がされています。

まとめ

今回は小ネタという感じでしたが、あまりにも初歩的なミスだったので自戒の意味を込めて記事にしました。

それにしても、Railsアプリ作成時にWebpackerをインストールするんならapplication.html.erbのCSS読み込みタグもWebpacker用に変更してほしいなあ...

関連記事

【Rails】GitHubのセキュリティアラートで発見された脆弱性を解消する方法
# はじめに GitHubにはセキュリティアラートという機能があります。セキュリティアラートはリポジトリに含まれるライブラリやパッケージの脆弱性を定期的にチェックし、脆弱性のあるライブラリやパッケージが発見されたらアラートで知らせてくれるという機 [...]
2022年1月16日 10:36
【Rails】devise-two-factorを使った2段階認証の実装方法【初学者】
# はじめに Railsアプリで2段階認証を実装するには、「rotp」というGemを使う方法の他に、「devise-two-factor」というGemを使う方法があります。「devise-two-factor」はその名の通り、IDとパスワードによ [...]
2021年12月12日 17:58
【Rails】rotpを使った2段階認証の実装方法【初学者】
# はじめに 昨今はIDとパスワードによる認証だけでなく、ワンタイムパスワードによる2段階認証を導入するWebアプリが増えてきました。Railsで作成したWebアプリでも、IDとパスワードによる認証に加えて2段階認証を導入するニーズが高まっていま [...]
2021年11月27日 13:02
【Rails】deviseを使った認証機能の実装【初学者】
# はじめに Railsアプリに認証機能を導入するには「devise」というGemを使う方法が最も簡単です。「devise」は認証に係る機能をほとんどコードを書くことなく実装できる反面、処理がブラックボックス化されており、全容が把握しづらいという [...]
2021年11月27日 13:01
【Rails】IDとパスワードによる認証機能の実装【初学者】
# はじめに 大抵のWebアプリでは、ユーザー登録/解除、ログイン/ログアウトといった認証機能を持っています。Railsには簡単に認証機能を導入できる「device」というGemが用意されています。「devise」は多くのRailsアプリで使われ [...]
2021年11月27日 13:00