目次
「stylesheet_pack_tag」タグが出力されない原因
railsアプリで、「Sprockets」から「Webpacker」に置き換えようとした時、「stylesheet_pack_tag」を使ったら全く出力されませんでした。
一方で、 「javascript_pack_tag」 は問題なく出力されています。
この違いが分からず、しばらくスタイルシートは「stylesheet_link_tag」を使ってました。
「javascript_pack_tag」 を利用するには、以下「config/webpacker.yml」の「extract_css」設定をtrueに変更し、アプリを再起動する事で利用可能です。
#extract_css: false
extract_css: true
後はインポート先も指定します。
「import “../stylesheets/application”」を追記指定し、その指定場所に「scss」ファイルを用意しました。
import * as ActiveStorage from "@rails/activestorage"
import "channels"
import "../stylesheets/application"
Rails.start()
Turbolinks.start()
ActiveStorage.start()
※変更前
<%= stylesheet_link_tag "application", media: "all" %>
※変更後
<%= stylesheet_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
参考
Qiita![](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
![](https://qiita-user-contents.imgix.net/https%3A%2F%2Fcdn.qiita.com%2Fassets%2Fpublic%2Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png?ixlib=rb-4.0.0&w=1200&mark64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9UnVieSUyMG9uJTIwUmFpbHMlMjAlRTMlODElQTclMjBzcHJvY2tldHMlMjAlRTMlODElOEIlRTMlODIlODklMjBXZWJwYWNrZXIlMjAlRTMlODElQjglRTclQTclQkIlRTglQTElOEMlRTMlODElOTclRTMlODAlODElRTclQTclQkIlRTglQTElOEMlRTMlODElQTclRTMlODElOEQlRTMlODElQUElRTMlODElODQlRTMlODIlODIlRTMlODElQUUlRTMlODElQUYlRTUlODUlQjElRTUlQUQlOTglRTMlODElOTUlRTMlODElOUIlRTMlODIlOEIlRTYlOTYlQjklRTYlQjMlOTUmdHh0LWFsaWduPWxlZnQlMkN0b3AmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZzPTI3YTYzYTA3MWYzODNkMmNlN2IwODc3Y2Y1MzU2YzIz&mark-x=142&mark-y=57&blend64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDB0YXRzdXJvdTMxMyZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9NjczMmNmYzA2MDIwZTdmNTM2ZTcxMDE1MGNjZGRiODM&blend-x=142&blend-y=436&blend-mode=normal&txt64=aW4gV0VTRUVLLCBJbmMu&txt-width=770&txt-clip=end%2Cellipsis&txt-color=%23212121&txt-font=Hiragino%20Sans%20W6&txt-size=36&txt-x=156&txt-y=536&s=50a3f71430e288052d99cb9eba46c41d)
Ruby on Rails で sprockets から Webpacker へ移行し、移行できないものは共存させる方法 - Qiita
はじめにRails6 以降は標準のモジュールバンドラとして Webpacker が使われるようになりました。それより前に使っていた Sprockets は可能な限り Webpacker へ移行で…
あわせて読みたい![](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
Rails 7.0でアセットパイプラインはどう変わるか | Wantedly Engineer Blog
Rails 7.0ではフロントエンドサポートが刷新されます。新たなライブラリが多数導入され、選択肢が増えるため、「Rails公式のものを選べばOK」という戦略が通用しなくなりま...