Rails7でTailwind CSSを試す

Rails7 になって TailwindCSS が使えるようになったので、導入方法をメモしておく。

rails new

rails new をするタイミングで tailwind を導入するには--css tailwindオプションを指定する。

rails new myapp --css tailwind
cd myapp

このあたりは定型文になるが載せておく。

rails g scaffold todo name:string
rails db:create db:migrate

rails sをしてhttp://127.0.0.1:3000/todosにアクセスする。

変わっていない…

Rails7 では起動方法に注意

Rails 7 ではrails sコマンドを実行しても JavaScript や CSS がビルドされず、./bin/devコマンドで起動すると JavaScript や CSS がビルドされる。 ブラウザをリフレッシュすると TailwindCSS が適用されていることがわかる。

また、./bin/devで起動すると JavaScript と CSS を変更したときに自動的に再ビルドもしてくれるので、今後はこちらで起動することを忘れないようにしたい。