rails7とbootstrapを試す。

フロントエンド開発が大きく変わりそうなrails7.
どんな感じになるか試したら、知識がアップデートできておらずはまったのでメモ.


環境は
$ bundle exec rails -v Rails 7.0.0
まずはesbuildとbootstrapで構築開始。
$ bundle exec rails new todo -j esbuild --css bootstrap

順調に進んだものの、ここでハマったのがアセットのコンパイルが失敗する件。
$ bundle exec rails assets:precompile

エラーを見ていくとyarn buildが失敗している。原因がわからん。
試行錯誤の結果、package.jsonにbuild設定が自動で追加されないことが原因と気づいた。
メッセージでadd ...と出ていたのをちゃんと読んでいれば。。。
"scripts": { "build": "esbuild app/javascript/*.* --bundle --outdir=app/assets/builds" }

また”Command css:build failed, ensure yarn is installed and `yarn build:css`”の場合は、

"scripts": { "build:css": "sass ./app/assets/stylesheets/application.bootstrap.scss ./app/assets/builds/application.css --no-source-map --load-path=node_modules" }

をpackage.jsonに追加設定してあげることで,起動後も問題なくbootstrapが利用できました。

$ bundle exec rails s

参考:

Rails 7 をちょこっと試す(さらば、Webpacker 編) - Qiita