Next.jsアプリのポートを変更する方法

Next.jsが開発モードで実行されるポートを変更する方法を学ぶ

Next.jsを使用してビルドされたアプリをローカルで実行しているときに、そのHTTPポートを変更する方法を尋ねられました。デフォルトでは、ポートは3000、しかしそれは一般的に使用されるポートであり、おそらく別のサービスが実行されています。

どうすれば変更できますか?

答えはにありますpackage.jsonNext.jsアプリのメインフォルダーに保存されているファイル。

デフォルトでは、ファイルの内容は次のとおりです。

{
  "name": "learn-starter",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start"
  },
  "dependencies": {
    "next": "9.3.5",
    "react": "16.13.1",
    "react-dom": "16.13.1"
  }
}

注:正確なパッケージ番号は、更新されるため、ケースによって異なります。

変更する必要があるのはscripts部。

変化する:

"dev": "next dev",

to

"dev": "next dev -p 3001"

to start Next.js on port 3001 instead of 3000.

Now when you run npm run dev, the command used to start the development server locally, you will see it start on port 3001:

Download my free Next.js Handbook


More next tutorials: