その他

npm run dev をした時に起きたエラーの対処法

この記事は約3分で読めます。

はじめまして。今年の10月に入社致しました岩木と申します。
初投稿で緊張しておりますが記事を書かせていただきます。

はじめに

最初にexpressでローカルでサーバーを開くために以下のコードを記載しました。
こちらはExpressの公式ドキュメントを参考にしました。
https://expressjs.com/ja/

const express = require("express");
const app = express();
const PORT = 5000;
app.use(express.json());

app.listen(PORT, () => console.log("インプル"));

どのようなエラーだったのか?

その後 npm run devをした時に
「既にポート5000番を使用していますよ。」
という内容のエラーが発生しました。

address already in use :::5000

試行錯誤の繰り返し

まず以下のコマンドで5000番のポート番号の実行中のプロセスを調べる。

lsof -i:5000
COMMAND  PID USER   FD   TYPE             DEVICE SIZE/OFF NODE NAME
node    6384 impl   24u  IPv6 0xad1270a5cf3ad381      0t0  TCP *:commplex-main (LISTEN)

その後、以下のコマンドでプロセスを強制終了させる。

kill -9 6384 

この流れで行けると思ったのですが、何故かうまくいかなかったんですよね。

ちなみにコマンドの内容を改めて説明させてもらうと

  • lsofはプロセスが開いているファイルを表示するコマンド。
  • -iオブションをつけることで現在利用されているポートを表示。
    PIDはプロセスのID。COMMANDは実行コマンド名。
  • killはプロセスを終了させるコマンド。
  • -9は強制終了させるコマンド。

結果的にどのように解決させたか?

MacOsのバージョンがMonterey 12 にアップデートされて以降
この現象が起きたらしくて
AirPlay serverによってこのプロセスが実行されているので
それを非アクティブにしました。

流れとしては
Macのリンゴマーク→システム環境設定→Air Playレシーバーで検索をかける。

そしたら以下の画面に辿り着くと思うので
ここのAir Playレシーバーのチェックを外す。

上記の対応をしたらエラーが解決できて
無事、ポート5000番を使用することができました。

最後に

この記事で参考になる方がどの程度いらっしゃるのか
わからないのですが
個人的に「技術系のブログをこのrambleで書いてみたい!」
という思いは、正直あったので書かせていただきました。

もしこの記事を見て、参考になる方が一人でもいれば
個人的に嬉しく思います。
失礼いたします。

参考

【MacOS Monterey12】ポート5000を利用しようとすると「Address already in use」が発生する - Qiita
最初に結論MacOS Monterey 12以降 、ポート5000を利用しようとするとAddress already in user が発生することがある。(2022/2 現在)この現象は、「A…