Laravel8環境構築時にnpm run devで大量エラー

Laravel
スポンサーリンク


Lravel8の環境構築時にnpm run devを実行したら大量にエラーが発生しました。
node.jsのバージョンが低いと発生するようなので、node.jsをupdateしてみました。

GCPで構築したUbuntu20.04で発生したエラーです。

GCPで構築したUbuntu20.04にPHP8をインストール
Ubuntu20の環境にPHP8をインストールする必要が発生しました。 デフォルトの状態だとUbuntu20にはPHP7.4がインストールされてしまうため、PHP8が含まれているリポジトリを追加する必要があります。 サーバはGCPのVMイン...
over40.work
2022.12.19

Ubuntu

$ cat /etc/issue
Ubuntu 20.04.5 LTS \n \l

Apache

$ apachectl -v
Server version: Apache/2.4.41 (Ubuntu)
Server built:   2022-06-14T13:30:55
スポンサーリンク

$ npm run devのエラー状況

npm run devを実行してみると…

$ npm run dev
> @ dev /home/hoge/example
> npm run development


> @ development /home/hoge/example
> mix

Error: You are using an unsupported version of Node. Please update to at least Node v12.14
    at assertSupportedNodeVersion (/home/hoge/example/node_modules/laravel-mix/src/Engine.js:6:15)
    at executeScript (/home/hoge/example/node_modules/laravel-mix/bin/cli.js:61:5)
    at Command.program.command.description.option.action (/home/hoge/example/node_modules/laravel-mix/bin/cli.js:47:13)
    at Command.listener [as _actionHandler] (/home/hoge/example/node_modules/commander/index.js:922:31)
    at Command._parseCommand (/home/hoge/example/node_modules/commander/index.js:1503:14)
    at Command._dispatchSubcommand (/home/hoge/example/node_modules/commander/index.js:1443:18)
    at Command._parseCommand (/home/hoge/example/node_modules/commander/index.js:1469:12)
    at Command.parse (/home/hoge/example/node_modules/commander/index.js:1292:10)
    at Command.parseAsync (/home/hoge/example/node_modules/commander/index.js:1318:10)
    at run (/home/hoge/example/node_modules/laravel-mix/bin/cli.js:50:19)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ development: `mix`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the @ development script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /root/.npm/_logs/2022-12-27T00_12_55_073Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ dev: `npm run development`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the @ dev script.

Laravel MIXでエラーが発生している模様
Node.jsのバージョンを確認してみます。

$ node -v
v10.19.0

公式サイトで最新バージョンを確認すると18.12.1 LTSが推奨版、19.3.0が最新版（2022年12月時点）となっている。
かなり古いnode.jsが入っていることが分かる。

Node.js — Run JavaScript Everywhere
Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.
nodejs.org

ちなみにインストールされているnpmのバージョンは

$ npm -v
6.14.4

node.jsのUpdate

推奨版がLTS(Long Term Support)となっているので、これをインストール

$ curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -
$ sudo apt install -y nodejs

再度node.jsのバージョンを確認してみると指定した通り、バージョン18がインストールされている。

$ node -v
v18.12.1

ちなみにnpmのバージョンがどうなったか見てみると、こちらも新しいものにアップグレードされていた

$ npm -v
8.19.2

npm run dev再実行

$ npm run dev
:
:
   Laravel Mix v6.0.49


? Compiled Successfully in 3101ms
--------------------------------------------------------------------------------
|                                                              File x Size     |
--------------------------------------------------------------------------------                                                        |                                                        /js/app.js x 697 KiB  |
|                                                       css/app.css x 49.5 KiB |
--------------------------------------------------------------------------------
webpack compiled successfully
npm notice
npm notice New major version of npm available! 8.19.2 -> 9.2.0
npm notice Changelog: https://github.com/npm/cli/releases/tag/v9.2.0
npm notice Run npm install -g npm@9.2.0 to update!
npm notice

無事に成功しました。

npmも9.2.0が最新版であるぞ!!とのことなのでUpdateしておきます。
※管理者権限で実行しないとエラー出ます

$ sudo npm install -g npm@9.2.0

npmのバージョンを確認

$ npm -v
9.2.0