1
/
5

Laravel8のセットアップとnpmのエラー

個人的にLaravelで作りたいアプリを思いついたので「どうせなら最新版で作るか!」と調べたところ、Laravel9のリリースが延期となっていました。
長期サポート版のLaravel6と現最新版のLaravel8で迷ったのですが、どちらもサポート期限が同じということに気づいたのでLaravel8を自分のPCにセットアップすることにしました。
あとでLaravel9にアップデートするのも楽だろうし。

あちこちのサイトを参考にxamppを入れたりcomposerを入れたりして、Laravel8のインストールは問題なく完了。
とりあえずの初期ページも表示には成功。

随分渋い色合いになってるけど、とりあえずは問題なし。

問題はここからで、Laravelにはユーザー登録/ログイン機能などを自動で作成してくれる便利なやつがついています。
laravel/uiというもので、Laravelでプログラムする際の見本が手軽に得られるので個人的にはありがたい機能です。
ところがこいつが曲者でした。
いくつかのサイトを参考にしたのですが、ターミナルから

npm run dev

を実行するとエラーになります。
npmは何かというと、パッケージ管理ツールの一種で、今回のはvue.jsを使用しているために実行が必要になります。
これがエラーになっているおかげで、cssが適用されずに情けない見た目になってしまいます。

13 verbose stack Error: @ dev: `npm run development`
13 verbose stack Exit status 2
13 verbose stack at EventEmitter.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\index.js:332:16)
13 verbose stack at EventEmitter.emit (events.js:400:28)
13 verbose stack at ChildProcess.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\lib\spawn.js:55:14)
13 verbose stack at ChildProcess.emit (events.js:400:28)
13 verbose stack at maybeClose (internal/child_process.js:1055:16)
13 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:288:5)

エラーログからそれっぽいキーワードで検索しても良い解決法が見つからず。

結局見つかった解決法が、まさかの「npmの再インストール」でした。
どうしてそんなことになっていたのこというと、Laravelが提供するpackage.jsonが正しくないケースがあり、それを元にインストールしたnpmがエラーになってしまうようです。
そんな状態で配布しないでほしいところですが、勉強の機会をもらったと思っておきましょう(あ、Laravel信者ってわけではないですよ)

npm cache verify
npm install --save-dev laravel-mix@latest
rm -r .\node_modules\
rm package-lock.json
rm yarn.lock
npm cache clear --force
npm install
npm run dev

上の一連のコマンドを実行して無事にコンパイルに成功しました。

それらしい見た目になりました。
事前にデータベースの設定などは必要ですが、ログインとユーザー登録、パスワードリマインダーなどの機能がほぼ自動で作成されます。
マイグレーションなどのLaravelの機能を試すこともできますので、「習うより慣れろ」派の人は使ってみると良いと思います。

E-kan株式会社's job postings

Weekly ranking

Show other rankings
If this story triggered your interest, go ahead and visit them to learn more