欢迎来到尧图网

客户服务 关于我们

您的位置:首页 > 科技 > IT业 > 生产环境下Nuxt3如何设置部署端口号?

生产环境下Nuxt3如何设置部署端口号?

2025/11/25 23:03:26 来源:https://blog.csdn.net/weixin_42553583/article/details/142287122  浏览:    关键词:生产环境下Nuxt3如何设置部署端口号?

Nuxt3默认的端口号3000.如果我们在一台服务器中部署多个Nuxt应用,都是3000端口必然会冲突,所以需要修改默认的端口号。在官网文档中,介绍的端口号修改方式是修改env环境变量。这个方式在Vercel或者一些serverless环境非常方便,在自己的服务器中,不可能设置多个PORT变量,所以有点鸡肋。
下面介绍一下在自己的服务器上如何修改Nuxt3默认端口。

教程部分

Nuxt3打包后如何修改端口号?

首先声明,我们这里介绍的是服务器渲染模式。如果是SPA或者SSG模式,纯静态文件,不需要端口号。

通过npm run build命令打包后,在.output文件夹,可以看到如下文件结构:

/.output
|---/public
|--/server
|-- nitro.json

打开上面的server文件夹,找到/chunks/runtime.mjs文件,搜索如下关键词:
process.env.PORT

搜索后,能看到如下代码:

const port = destr(process.env.NITRO_PORT || process.env.PORT) || 3e3;

上面的代码中,3e3就是3000,改成你想自定义的端口号,比如3001即可。

还是在Nuxt3中修改端口号的几种方式:

知识补充:所有修改端口号的方法

1.开发环境

如果是开发环境,只需要在nuxt.config.ts文件中配置即可,具体配置方法如下:

export default defineNuxtConfig({devServer: {port:3001}
})
2. 生产环境

在生产环境下,我们可以先配置nuxt的环境变量参数,然后在服务器上配置环境变量。具体方法如下:
(1)第一步:在nuxt应用的.env文件中,新增以下变量:

PORT=3001
//NITRO_PORT=3001

有的应用没有.env文件,可以自己创建一个。PORT变量和NITRO_PORT变量是等价的,设置一个即可。
(2)第二步:在服务器上设置环境变量
这里以Linux系统为例,在命令上中输入以下命令:

echo 'export PORT=3001' >> ~/.bashrc

这个命令是为当前用户设置环境变量。
如果使用这种方式,大家要理解环境变量的设置方式和作用范围。
Windows系统可以自行搜索环境变量的设置方式。

大家好,我是刘明,前端工程师,AI算法工程师,华为昇思布道师。大家如果有问题可以给我私信,欢迎大家多多交流

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com

热搜词