改变Next.js默认端口的方法

Next.js的默认访问端口是3000。有时环境需要更改。

方法1 通过环境变量 此方法不能改变端口,看方法2

点击查看官方文档

Next.js will automatically expand variables that use $ to reference other variables e.g. $VARIABLE inside of your .env* files. This allows you to reference other secrets.

翻译:Next.js 将自动展开使用 $ 引用其他变量的变量,例如在您的 .env* 文件中的 $VARIABLE。这使您能够引用其他密钥。

意思是说Next.js会加载.env*文件中的变量。注意:*是统配符,也就是.env开头的文件中的变量都会加载

官方文档还说

Default Environment Variables
In general only one .env.local file is needed. However, sometimes you might want to add some defaults for the development (next dev) or production (next start) environment.
Next.js allows you to set defaults in .env (all environments), .env.development (development environment), and .env.production (production environment).
.env.local always overrides the defaults set.
Good to know: .env, .env.development, and .env.production files should be included in your repository as they define defaults. .env*.local should be added to .gitignore, as those files are intended to be ignored. .env.local is where secrets can be stored.

翻译:

默认环境变量
通常只需要一个 .env.local 文件。然而,有时您可能希望为开发(next dev)或生产(next start)环境添加一些默认值。
Next.js 允许您在 .env(所有环境)、.env.development(开发环境)和 .env.production(生产环境)中设置默认值。
.env.local 总是覆盖设置的默认值。
需要注意的是:.env、.env.development 和 .env.production 文件应包含在您的存储库中,因为它们定义了默认值。.env*.local 应该添加到 .gitignore 中,因为这些文件应该被忽略。.env.local 是用于存储机密信息的地方。

再看官方文档

Environment Variable Load Order
Environment variables are looked up in the following places, in order, stopping once the variable is found.

  1. process.env
  2. .env.$(NODE_ENV).local
  3. .env.local (Not checked when NODE_ENV is test.)
  4. .env.$(NODE_ENV)
  5. .env

For example, if NODE_ENV is development and you define a variable in both .env.development.local and .env, the value in .env.development.local will be used.
Good to know: The allowed values for NODE_ENV are production, development and test.

翻译:

环境变量加载顺序
环境变量按照以下顺序查找,一旦找到变量就停止。

  1. process.env
  2. .env.$(NODE_ENV).local
  3. .env.local(当 NODE_ENV 为 test 时不会被检查)
  4. env.$(NODE_ENV)
  5. env

例如,如果 NODE_ENV 为 development,并且您在 .env.development.local 和 .env 中都定义了一个变量,那么将使用 .env.development.local 中的值。
需要知道的是:NODE_ENV 允许的值为 production、development 和 test。

举例:
.env.local文件中写

PORT=8088

方法2 命令行

官方文档

Production
next start starts the application in production mode. The application should be compiled with next build first.
The application will start at http://localhost:3000 by default. The default port can be changed with -p, like so:
生产环境
next start 以生产模式启动应用程序。首先,应用程序应该使用 next build 进行编译。
应用程序默认将在 http://localhost:3000 上启动。默认端口可以使用 -p 参数进行更改,例如:

npx next start -p 4000

Or using the PORT environment variable:
或者使用 PORT 环境变量:

PORT=4000 npx next start

Good to know:
-PORT cannot be set in .env as booting up the HTTP server happens before any other code is initialized.
next start cannot be used with output: ‘standalone’ or output: ‘export’.
需要知道的是:
PORT 不能在 .env 中设置,因为启动 HTTP 服务器会在初始化任何其他代码之前发生。
next start 不能与 output: ‘standalone’ 或 output: ‘export’ 一起使用。

一般是写在package.json文件中,例如:

{
....
	"scripts": {
    	"dev": "PORT=3001 next dev",    #开发端口是3001
    	"start": "next start -p 3002",  #生成端口是3002
    },
...
}

你可能感兴趣的:(javascript,前端,Next.js)