next. js_如何更改Next.js应用程序端口

next. js

I’ve been asked how to change the HTTP port of an app built using Next.js, when you are running it locally. By default the port is 3000, but that’s a commonly used port and perhaps you have another service running on it.

当您在本地运行时，有人问我如何更改使用Next.js构建的应用程序的HTTP端口。 默认情况下，端口为3000 ，但这是一个常用的端口，也许您正在运行其他服务。

How can you change it?

您该如何更改？

The answer is in the package.json file stored in the Next.js app main folder.

答案在Next.js应用程序主文件夹中存储的package.json文件中。

By default the file content is this:

默认情况下，文件内容为：

{
  "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"
  }
}

Note: the exact packages numbers will differ in your case, as they get updated

注意：具体包号在您的情况下会有所不同，因为它们会更新

The thing you need to change is the scripts part.

您需要更改的是scripts部分。

Change:

更改：

"dev": "next dev",

to

至

"dev": "next dev -p 3001"

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

在端口3001而不是3000上启动Next.js。

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

现在，当您运行npm run dev ，用于本地启动开发服务器的命令将在3001端口启动：

翻译自: https://flaviocopes.com/nextjs-change-app-port/

next. js