Laravel9でAuth関連ファイルを生成した後にnpm installができない時の対処法

Laravel9で認証機能を実装しようとしたときにnpm installコマンドが正常に動かなかったので、そこまでの流れとその解決方法を紹介していきます。

laravelで認証機能を実装するため、以下のコマンドを打ちました。

$composer require laravel/ui

その後にAuth関連ファイルを生成する(今回はvueで生成)

$php artisan ui vue --auth

そして次に打つコマンド

$npm install
$npm run build ← これはnpm installが正常に動作した後に実行するコマンド

もしくは

$npm install && npm run build

ここまで打った時点で以下のようなエラーが出た。

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: undefined@undefined
npm ERR! Found: vite@4.0.2
npm ERR! node_modules/vite
npm ERR!   dev vite@"^4.0.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer vite@"^3.0.0" from @vitejs/plugin-vue@3.2.0
npm ERR! node_modules/@vitejs/plugin-vue
npm ERR!   dev @vitejs/plugin-vue@"^3.0.1" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

上記のエラーは、インストールしているパッケージが古いためにでているエラーではないかと考えました。

そのため、package.jsonに記載させれているパッケージをすべて以下のコマンドを打ってアップデートしてみました。

$npm install -g npm-check-updates
$npm-check-updates -u
$npm update

これでアップデートは完了したので、再度npm installとnpm run build(npm install && npm run build)を実行してみました。

すると、npm installとnpm run buildを実行してもエラーが起こることなく正常に終わらせることができました。

あとは実際にサーバーを動かして確認してみる。

以下のコマンドでサーバーを起動させる。

$php artisan serve

その後に127.0.0.1:8000/homeにアクセスすると、ちゃんとログイン画面が表示されました。

最後に

composerでlaravel/uiをインストールする前やしてすぐにアップデートをしてAuth関連ファイルを生成しても、npm install(もしくはnpm install && npm run build)をしたときの結果は同じでした。なので、少し手間はかかりますが今回のようなエラーにはとりあえずでも使えると思います。