【Laravel８】npm audit fixしたらLivewireが動かなくなった

「npm audit fix」したらというか、ライブラリ関連をいろいろいじくった結果、だと思うけど、Livewireが動かなくなった｡ﾟ(ﾟ´Д｀ﾟ)ﾟ｡

経緯

先日、「npm audit」したら問題がいくつか出てきたので、「npm audit fix」を実行した。

問題が多すぎて、すべては解決できず、手動でパッケージをアップデートなどして結構長い時間格闘。その結果すべては解決できなかったものの、とりあえずは一段落ついてアプリの制作を進めていた。

ふと、Laravel８のダッシュボードの右上のユーザー情報ボタンを押したところ、動かない。。。

多分ここLivewireのAlpineJSが使われている。コンソールなどに特にエラーなどないのだが、とにかく動かない！

原因

Laravel８周りを完全に理解してないので、実際なにが原因かわからないけど、AlpineJSのバージョンを上げたのが原因っぽい。

2.7.3　→　3.0.1

バージョンを上げても動く方法があると思うけど、今はわからないっすヽ( ゜ 3゜)ノ

解決方法

AlpineJSのバージョンを元に戻す。

package.jsonのAlpineJSのバージョンの所を、2.7.3にもどして、

npm install

npm run dev

を実行したら治った。

動作に問題はないものの、コンソールに以下のエラー

Livewire: The published Livewire assets are out of date
See: https://laravel-livewire.com/docs/installation/

publishされたアセットの更新が必要そう。ということで、

php artisan livewire:publish

これでエラーは消えて無事解決！

今後アセットを最新に保つために、composer.jsonに以下の一文を追記しておくと良いとか。

{
    "scripts": {
        "post-autoload-dump": [
            "Illuminate\Foundation\ComposerScripts::postAutoloadDump",
            "@php artisan package:discover --ansi",
            "@php artisan vendor:publish --force --tag=livewire:assets --ansi" // ←これ
        ]
    }
}

まとめ

JetstreamやらLivewireやらLaravel８から採用になった新しい機能たちですが、まだついていけません。。。ネット上でもこの辺りの問題解決法などが少なく英語圏の記事を探ってどうにか解決できました。
早くLaravel８を使いこなせるようになりたい今日このごろです。