Laravel npm run devでエラーが発生した話

# 目的

- npmを用いて必要パッケージを取得後に`$ npm run dev`を実行したらエラーが発生した話をまとめる

# 実施環境

- ハードウェア環境

| 項目 | 情報 |
| --- | --- |
| OS | macOS Catalina(10.15.5) |
| ハードウェア | MacBook Pro (13-inch, 2020, Four Thunderbolt 3 ports) |
| プロセッサ | 2 GHz クアッドコアIntel Core i5 |
| メモリ | 32 GB 3733 MHz LPDDR4 |
| グラフィックス | Intel Iris Plus Graphics 1536 MB |

- ソフトウェア環境

| 項目 | 情報 | 備考 |
| --- | --- | --- |
| PHP バージョン | 7.4.3 | Homwbrewを用いて導入 |
| Laravel バージョン | 7.0.8 | commposerを用いてこちらの方法で導入→[Mac Laravelの環境構築を行う](https://qiita.com/miriwo/items/adaaaeecae69d6392e08) |
| MySQLバージョン | 8.0.19 for osx10.13 on x86_64 | Homwbrewを用いてこちらの方法で導入→[Mac HomebrewでMySQLをインストールする](https://qiita.com/miriwo/items/ef6a064bc545fbea29d9) |
| Node.jsバージョン | 14.6.0 | こちらの方法で導入した→[AWS EC2 AmazonLinux2 Node.jsをインストールしてnpmコマンドを使用できる様にする](https://qiita.com/miriwo/items/4ac80bc51bb072ace652) |
| npmバージョン | 6.14.6 | こちらの方法で導入した→[AWS EC2 AmazonLinux2 Node.jsをインストールしてnpmコマンドを使用できる様にする](https://qiita.com/miriwo/items/4ac80bc51bb072ace652) |

# エラーの原因

- `$ npm install`を実行し忘れていた。

# 問題までの経緯

1. 下記で紹介されている内容を実施したくてLaravelアプリを新規作成した。
    - [https://blog.capilano-fw.com/?p=3998](https://blog.capilano-fw.com/?p=3998)
1. アプリ名ディレクトリに移動後、下記コマンドを実行してパッケージインストールを行った。

    ```terminal
    $ npm install simple-peer --save-dev
    $ npm install pusher-js --save-dev
    ```
1. アプリ名ディレクトリで下記コマンドを実行してのbootstrap.jsを開く。

    ```terminal
    $ vi resources/js/bootstrap.js
    ```
1. 下記の内容を追記する。

    ```resources/js/bootstrap.js
    window.Peer = require('simple-peer');
    window.Pusher = require('pusher-js');
    ```
1. アプリ名ディレクトリで下記コマンドを実行してapp.jsを開く。

    ```terminal
    $ resources/js/app.js
    ```
1. 下記の記載をコメントアウトした。
    1. 修正前

        ```resources/js/app.js
        const app = new Vue({
          el: '#app'
        });
        ```
    1. 修正後

        ```resources/js/app.js
        //const app = new Vue({
        //  el: '#app'
        //});
        ```
1. アプリ名ディレクトリで下記コマンドを実行してビルドを試みた。

    ```terminal
    $ npm run dev
    ```

# 問題

1. 下記のエラーが発生した。

    ```terminal
    > @ dev /var/www/html/pusher_video
    > npm run development
    
    
    > @ development /var/www/html/pusher_video
    > cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js
    
    sh: cross-env: command not found
    npm ERR! code ELIFECYCLE
    npm ERR! syscall spawn
    npm ERR! file sh
    npm ERR! errno ENOENT
    npm ERR! @ development: `cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js`
    npm ERR! spawn ENOENT
    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!     /home/ec2-user/.npm/_logs/2020-08-04T03_20_02_697Z-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.
    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!     /home/ec2-user/.npm/_logs/2020-08-04T03_20_02_713Z-debug.log
    ```

# 問題解決までの経緯

1. `$ npm install`を実行していなかったことに気が付き実行した。
1. 再度`$ npm run dev`を実行したところエラーは発生せず問題は解決した。