Laravel のフロントエンドビルドツールが Vite に変わった
目次
最近、自分以外のメンバーがあまりこのブログを書いてくれないので、仕方なくこの記事を書くことに・・・というわけでは無いですが、Laravel を使っていてちょっとした躓きがあったので書くことにしました。
はじめに
問題は現在は直っています
私が遭遇した問題は現在では直っています。以下の通りに実行し、
curl -s "https://laravel.build/laravel-example-app" | bash
cd laravel-example-app && ./vendor/bin/sail up
# 別ウィンドウで
./vendor/bin/sail composer require laravel/breeze --dev
./vendor/bin/sail php artisan breeze:install
./vendor/bin/sail npm install
./vendor/bin/sail npm run dev
# さらに別ウィンドウで
./vendor/bin/sail php artisan migrate
その後に、以下の URL にアクセスすると、正しく表示されます。
http://localhost/register
問題は既に解決しているので、本記事では解決方法については記載せず（Laravel や関連モジュールを最新版にアップグレードすれば良い）、仕組みその他などについて記載します。
私は Laravel には詳しくないです
私は Laravel には詳しくないので、記載に間違った部分があった場合はすみません。
問題点
背景
とある新規プロジェクトが6月くらいに本格的に動き出したのですが、そのプロジェクトでは Laravel 9.x で開発を始めました。7月頭くらいに Laravel Breeze を使って認証機能の土台（scaffold）を作ろうとしたところ、画面のレイアウトが崩れた状態になりました。新規でプロジェクトを作り直しても現象が解決しなかったので調査したところ、Laravel のデフォルトのフロントエンドビルドツールが Vite に変わった事が原因となっているようでした。
概要
Laravel Breeze のドキュメント（以下のリンクを参照）に従って認証機能の土台を構築しようとしても、画面のレイアウトが崩れた状態にしかなりませんでした。
Starter Kits – Laravel – The PHP Framework For Web Artisans
6月末〜7月前半に Laravel + Laravel Breeze で新規プロジェクトを作った人はこの問題の影響を受けていたと思います。
解決方法
前述の通り、現在は直っています。Laravel や関連モジュールを最新版にアップグレードすれば良いはずです。
Laravel 本体や Laravel Vite プラグインの過去の PR を見ると、7月にバージョンアップが何回かあったので、その時に直ったのかもしれません。
経緯等
デフォルトのフロントエンドビルドツールが Vite になった
以下の Changelog によると、6/28 にリリースされた Laravel 9.19.0 で Vite のサポートが入っています。
framework/CHANGELOG.md at 9.x · laravel/framework
修正内容の PR は以下の通りです。
[9.x] Vite by jessarcher · Pull Request #42785 · laravel/framework
PR の概要に記載の通り、Laravel Breeze, Laravel Jetstream にも同時に修正が入っています。
Laravel News というサイトでも以下のように発表されています。
Vite is now the default frontend asset bundler for Laravel applications | Laravel News
従来は Laravel Mix という webpack のラッパーを使っていた
Laravel には Laravel Mix という webpack のラッパーがあり、従来はデフォルトのフロントエンドのビルドツールが Laravel Mix でした。
Laravel Mix は webpack のラッパーで、webpack を簡単に使えるようにすることを目的としているのだと思います。「An elegant wrapper around Webpack for the 80% use case.」と謳っているので、基本的な webpack のタスクであれば Laravel Mix で簡単に扱えるのだと思います。
とはいえ、ちょっと何かをやろうとすると邪魔になってくることも多く、弊社で Laravel を使っている別のプロジェクトでは、当初は Laravel Mix を使っていましたが、後から webpack をそのまま使うように切り替えました。
Larave Vite Plugin と Laravel Vite
Laravel の以下の PR を見れば分かる通り、
[9.x] Vite by jessarcher · Pull Request #5904 · laravel/laravel
Laravel には Laravel Vite Plugin というのがあり、Vite 関連の機能はそちらに依存しています。
laravel/vite-plugin: Laravel plugin for Vite.
なお、それとは（多分）別で Laravel Vite というものもありますが、現在はこちらを使用しなくても（Laravel Vite Plugin だけで） Vite が使えます。
Laravel Vite – Vite integration for the Laravel framework | Laravel Vite
Vite とは
高速なフロントエンドビルドツールだそうです。従来のツールにどういう問題があって、 Vite がそれをどう解決しているか、については以下のページをご参照ください。
なお Vite はフランス語の単語 vite （「速い」の意）から来ているようです。発音はビットです。
所感
（現在は直っている）問題点や経緯などについて説明したところで、この問題に関する個人の感想などを述べたいと思います。
随分不安定な状態でリリースしたな
Laravel が Vite をデフォルトにした時点での Laravel Vite Plugin のバージョンは 0.2.1 です。また、Laravel Vite の最初のコミットは今年の5/2なので、Vite がデフォルトとなったLaravel 9.19.0 のリリースまで2ヶ月弱しか経っていません。
もちろんバージョン番号が低いから/プロジェクト開始から日数が経っていないから安定していないとは言い切れないものの、その後、矢継ぎ早に 0.2.3 -> 0.2.4 -> 0.3.0 -> 0.4.0 -> 0.5.0 -> 0.5.1 -> 0.5.2 とバージョンアップしているのを見ると（以下のコミット履歴を参照）、まだまだ安定していないように見えます。
History for package.json – laravel/vite-plugin
もう少し安定してから取り入れるとか出来なかったのでしょうか。
これをマイナーバージョンアップで入れてくるか
前述の通り、Laravel 9.19.0 で Vite がデフォルトとなるのですが、そもそもこういった大きな変更をマイナーバージョンアップで入れてくるというのはちょっとどうなの、と思いました。
Laravel のリリースサイクルを見ると、ほぼ1年に1回バージョンアップしていて、次のバージョン10は来年の2月を予定しているので、そこまで待つのは長いというのも分かります。ただ、それであれば、前項に書いた通り、もう少し安定してから入れて欲しいです。
そもそも Laravel ってどうなんだろう
最初の方に書いた通り、私は Laravel には詳しくはありません。また、web アプリケーション開発をメインの仕事としているわけでもありません。それでも、Laravel を使ってみて思うのは、（便利ですし優れたフレームワークだというのは認めていますが、それでも）使う言語が PHP という要件がなければ、他のフレームワークで良いのでは、ということです。
従来型のウェブアプリであれば Ruby on Rails で良いと思いますし、API だけを提供するようなアプリでしたら、さらに言語・フレームワークの選択肢が増えます。
ちなみに Rails と Laravel の長所・短所を知りたいと思って検索したのですが、ちゃんとした記事が意外に少なかったので、気が向いたら比較記事を書いてみようと思います。
まとめ
まとめるほどの内容は特にないのですが、この問題の解決に数時間くらいは費やしたので疲れました。Laravel はメジャーなソフトウェアなので、不安定な機能をリリースするのは避けて欲しいなと思いました。
コメントを残す