かなり初歩的なところでつまづいて何時間も無駄に費やした記録
Ruby 3.1.1 + Rails 7.0.2.3
何が起こった?
初めて Ruby on Rails 7 で簡単なウェブアプリを作ろうとしていた。
スタイルシートは,空の状態から始め,app/assets/stylesheets/application.sass.scss
に少しだけ記述を行なった。
しかし反映されなかった。
やったこと
この節は,実際にやったことをかなり単純化して記述している。
前半
Sass を使う前提で
rails new hoge -c sass
として Rails アプリを作り,いくつかのモデルとコントローラーを書いた。
スタイルは一切書かずに動作確認などを行なった。
開発中は
bin/dev
でサーバーを起動していた。
ここで,「production 環境での動作がどうなるか」と思い,
rails s -e production
でサーバーを起動し直し,ブラウザーで表示させたところ,エラーが出た。
log/production.log
には
ActionView::Template::Error (The asset "application.css" is not present in the asset pipeline.
と出ていた。
あ,そうか,production 環境ではプリコンパイルした CSS を用意しないといけないのだった。
そこで,
rails assets:precompile RAILS_ENV=produciton
とすると,public
の下に assets
ディレクトリーが出来て,いくつかのファイルができた。
もちろんその中に application-なんちゃらかんちゃら.css
もある。中身は空(まだスタイルを一切書いてないので当たり前)。
これでエラーは出なくなった。
後半
さて,ここから開発を再開。
モデル,コントローラーなどを作り進め,「そろそろスタイルも書いていくか」と思ったものの,Rails 7 における CSS のルールがよく分からない。
とりあえず app/assets/stylesheets/application.sass.scss
に
body {
background: yellow;
}
のような簡単な記述を行なってどうなるか調べた。
反映されない。背景が黄色くならない。
うーむ,やはり Rails 7 の CSS についての基本的な知識が欠けているようだ。
ここから,さまざまな実験を行なったりウェブ検索したり,
cssbundling-rails gem の説明(英語)を頑張って読んでみたりもしたが,よく分からない。
確実に分かって安心できた点は,
bin/dev
を起動している間は
yarn build:css --watch
が効いているので,application.sass.scss
に書いた内容が即座に app/assets/builds/application.css
に反映される,ということであった。
builds
下に反映されるということは,〈そこそこうまくいっている〉はず。cssbundling-rails の説明でも,出来たファイルが builds
下に置かれる,と書いてあった。
問題は,なぜ builds
下のスタイルシートがブラウザーで読み込まれないか,だ。
そこで,見ている画面の HTML を開き,<link rel="stylesheet" ...
を見つけ,href
属性を確認し,そのパスを直接ブラウザーで開いた。
そいつは空っぽであった。
手詰まり感で陰鬱な気持ちになった。
今まで sprockets が裏で何をやってくれていたかとか意識したことがなかった。Rails 7 の新しいアセット管理の仕組みの理解も浅い。
うーん。
ここまでで数時間,いや十時間くらい溶かしただろうか。
解決
ふと,public
ディレクトリーの下に assets
が出来ていることを思い出した。
こいつを消してみたらどうなるのか。
assets
をディレクトリーごと削除して,
bin/dev
をいったん落として再起動してみたところ,記述したスタイルが反映された。
この状態で app/assets/builds/application.css
の記述を変更し,ブラウザーで画面をリロードしてみると,即座に反映された。
なんのことはない,development 環境であっても public/assets
にスタイルシートがあればそれが読み込まれるというだけのことであったらしい。
まだ完全に理解できたわけではないが,だいたい分かった。いちおうこれで解決。
Rails のアセット管理が分かっている人にすれば「あたりまえやん」なのかもしれないが,Rails 7 という未知の世界に足を踏み入れ,大いに迷ったのであった。
あとがき
これ,Rails 7 未満でも同じなんですかね?
development 環境はローカルだけで使い,production 環境は本番サーバーだけで使う,というのが普通だと思うが,たとえば自分だけが(自分の特定のマシン上だけで)使う住所録を Rails で作ったとき,同じ場所で development でも production でも使うっていうことはあると思うんだけど,そういう場合はどうすればいいのだろう?