当前位置: 首页 > article >正文

生产环境下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算法工程师,华为昇思布道师。大家如果有问题可以给我私信,欢迎大家多多交流


http://www.kler.cn/news/306342.html

相关文章:

  • es6(1)
  • Dubbo从入门到实战
  • 9.12-kubeadm方式安装k8s+基础命令的使用
  • 【Unity】 HTFramework框架(五十六)MarkdownText:支持运行时解析并显示Markdown文本
  • 微服务实战系列之玩转Docker(十五)
  • java实现策略模式
  • 腾讯又开放了一款新的开发工具,用起来真优雅
  • Python 中常见的数据结构(二)
  • AWTK fscript 中的 value 扩展函数
  • 安卓BLE蓝牙通讯
  • 智慧灯杆系统架构及各个子系统功能介绍
  • 【技术调研】三维(4)-ThreeJs阴影投射、光线投射及案例
  • three.js KeyframeTrack
  • SpringMVC 入门案例详解
  • 免费像素画绘制软件 | Pixelorama v1.0.3
  • ArrayList动态数组
  • react18基础教程系列--安装环境及packagejson文件分析
  • llama网络结构及源码
  • 【MySQL学习】基础指令全解:构建你的数据库技能
  • OPENAIGC开发者大赛高校组金奖 | 基于混合大语言模型与多模态的全过程通用AI Agent
  • 【搜索算法】以扩召回为目标,item-tag不如query-tag能扩更多数量
  • 软件设计师——程序设计语言
  • 【短距离通信】【WiFi】精讲Android WiFi P2P架构及代码示例
  • SpringBoot教程(安装篇) | RabbitMQ的安装
  • MySQl篇(数据类型)(持续更新迭代)
  • 面试常见题之Spring Cloud
  • Redis常见应用场景
  • fsck 命令:修复文件系统错误
  • 读构建可扩展分布式系统:方法与实践05分布式缓存
  • 2-3.Android 存储之存储空间(私有空间、公共空间)