BOYYANG/1/blog/compressed/【哲风壁纸】古风-少女-eb73e7b1e0b0f759acd80e2b221bc203

nuxt3 docker 部署修改项目默认启动端口

作者: boyyang
分类: docker
发布: 2025-03-19 05:26:17
更新: 2025-03-21 05:39:06
浏览: 132

   nuxt3默认启动端口为3000,部署上线时3000端口可能被使用或者想修改,我通过网上查找解决方法发现很多都没有任何作用,使用node启动后还是3000端口。

   由于我使用的是docker部署,所以仅仅针对docker部署如何修改nuxt3项目启动端口的修改。

第一步打包nuxt3项目

nuxt build

打包成功后会在项目中出现.output的文件夹,将该文件夹上传到服务器中的某个文件夹下。

第二步创建dockerfile

在第一步的文件夹下创建Dockerfile文件,文件内容如下:

#1、基于镜像node版本
FROM node:22.12.0
#2、作者
MAINTAINER boyyang
#3、参数,node的环境为生产环境
ENV NODE_ENV=production
#4、任意ip
ENV HOST 0.0.0.0
#5、容器内创建目录/nuxt3
RUN mkdir -p /nuxt3
#6、复制当前的内容到容器内容部目录/nuxt3
COPY .output/ . /nuxt3/
#7、切换工作目录到/nuxt3
WORKDIR /nuxt3
#8、暴露端口3000,默认端口
EXPOSE 3000
#12、start
CMD ["node","./.output/server/index.mjs"]

第三步通过dockerfile制作镜像

在dockerfile 目录下打开终端,或者在终端中切换到dockerfile所在目录(不要忘了nuxt3 后面有个点)

docker build -t nuxt3 .

通过上面的命令镜像制作成功后通过docker images 可以查看制作的镜像nuxt3是否成功

第四部创建容器并且修改项目启动端口

docker run --name nuxt3Container -e NITRO_PORT=3001 -d  -p 3001:3001 nuxt3 

成功后就可以通过容器日志看到nuxt3项目的启动端口已经是3001端口了

#vue3
#nuxt3
#docker
#前端
#后端
#vue2