CentOS使用docker部署nuxt3应用

2024年10月11日06:40:23 发表评论 阅读(4,549)

CentOS使用docker部署nuxt3应用

在服务端部署Nuxt 3 应用有多种途径,既可以通过 Node.js 直接启动服务,也能利用 PM2 实现无人值守的自动化运维。那么,我为何偏要选择 Docker 来部署呢?

原因在于,自 Node.js 18 版本起,官方已不再支持 CentOS 7 系统。CentOS 7 的 glibc 版本相对较低,限制了其仅能安装至 Node.js 16 版本,而升级整个系统不仅繁琐,还可能引发一系列兼容性问题。

尤为关键的是,我的 Nuxt 3 应用需要 Node.js ≥18 版本方能稳定运行,且 Nuxt 3 官方亦强烈推荐使用 Node.js 18 或更高版本来确保应用的最佳性能与兼容性。因此,采用 Docker 部署 Nuxt 3 应用成为了一个既高效又便捷的选择。本文将简要阐述如何运用 Docker 技术来构建并部署 Nuxt 3 应用的过程。

CentOS使用docker部署nuxt3应用

编写Dockerfile文件

  1. # 指定基于 node:18.20.3-alpine 镜像构建
  2. FROM node:18.20.3-alpine
  3. # 设置默认工作目录为 /home/nuxt-vue/default
  4. WORKDIR /home/nuxt-vue/default
  5. # 将当前目录下的所有文件复制到容器的 /home/nuxt-vue/default 目录下
  6. COPY . .
  7. # 设置 NUXT_HOST 环境变量为 0.0.0.0,表示监听所有网络接口
  8. ENV NUXT_HOST=0.0.0.0
  9. # 设置 NUXT_PORT 环境变量为 3000,表示应用运行的端口号
  10. ENV NUXT_PORT=3000
  11. # 暴露容器的 3000 端口,使得外部可以访问
  12. EXPOSE 3000
  13. # 设置容器启动时执行的命令,这里使用 node 命令运行 .output/server/index.mjs 文件
  14. ENTRYPOINT ["node"".output/server/index.mjs"]

上述文件放至nuxt3构建产物.output同级的文件夹目录,并将其上传至服务器指定目录,本文的指定目录是 /home/nuxt-vue/default

安装docker

  1. # 更新系统包
  2. sudo yum update -y
  3. # 安装必要的依赖
  4. sudo yum install -y yum-utils device-mapper-persistent-data lvm2
  5. # 添加Docker的官方仓库
  6. sudo yum-config-manager --add-repo https://download.docker.com/linux/centos/docker-ce.repo
  7. # 安装Docker
  8. sudo yum install docker-ce docker-ce-cli containerd.io -y
  9. # 启动Docker服务
  10. sudo systemctl start docker
  11. # 设置Docker开机自启
  12. sudo systemctl enable docker

构建Docker镜像

  1. docker build -t my-nuxt-app .

这里 -t 参数用于给镜像命名,例如 my-nuxt-app,镜像名字按自己喜好,不过最好和项目相关,方便区分。

CentOS使用docker部署nuxt3应用

运行Docker容器

  1. docker run -d -p 3000:3000 --name my-running-nuxt-app my-nuxt-app

上述命令的作用是:

  • docker run 启动一个新的 Docker 容器。
  • -d 以守护进程模式(后台模式)运行容器,容器启动后不会阻塞终端。
  • -p 3000:3000 将容器内的端口 3000 映射到宿主机的端口 3000。
  • --name my-running-nuxt-app 给容器命名为 my-running-nuxt-app。
  • my-nuxt-app 使用 my-nuxt-app 镜像来启动容器。

CentOS使用docker部署nuxt3应用

验证

  1. 打开浏览器访问 http://localhost:3000,应该可以看到你的应用运行起来了。

docker常用命令

  1. # 构建一个 Docker 镜像,并将其标记为 my-nuxt-app
  2. docker build -t my-nuxt-app .
  3. # 在后台模式(-d)启动一个 Docker 容器,并将容器内的端口 3000 映射到宿主机的端口 3000,容器命名为 my-running-nuxt-app
  4. docker run -d -p 3000:3000 --name my-running-nuxt-app my-nuxt-app
  5. # 列出当前正在运行的所有容器
  6. docker ps
  7. # 列出所有容器(包括已停止的)
  8. docker ps -a
  9. # 停止名为 my-running-nuxt-app 的容器
  10. docker stop my-running-nuxt-app
  11. # 重启名为 my-running-nuxt-app 的容器
  12. docker restart my-running-nuxt-app
  13. # 查看名为 my-running-nuxt-app 的容器的日志
  14. docker logs my-running-app
  15. # 移除名为 my-running-nuxt-app 的容器
  16. docker rm my-running-nuxt-app
  17. # 移除名为 my-nuxt-app 的镜像
  18. docker rmi my-nuxt-app
tips

因为众所周知的一些原因,docker官方镜像不太稳定,我们可以通过配置国内镜像来进行访问加速。

  1. 编辑 daemon.json 文件(没有的话手动创建一个):
  1. sudo vim /etc/docker/daemon.json

2. 添加镜像加速器配置

  1. {
  2.   "registry-mirrors": [
  3.     "https://dockerproxy.cn",
  4.     "https://mirror.iscas.ac.cn"
  5.   ]
  6. }

3. 输入:wq,保存退出

4. 重启docker

  1. sudo systemctl restart docker

根据上述内容,执行以下步骤

  1. 构建Docker镜像
  2. 运行Docker容器
最后

欢迎大家访问文中提到的,已经docker部署成功的nuxt3应用:

地址:https://nuxt-vue.haoht123.com/

 

 

weinxin
微信小程序
互联网开发,终身学习者,欢迎您的关注!
舍得

发表评论

不高兴 彩虹 吃瓜 丢翔 乖 滑稽 花心 惊哭 惊讶 挤眼 酷 伤心 帅吗? 礼物 玫瑰 怒 生气 喷 睡觉 太开心 小九九 啊
太阳 吐舌 委屈 笑眼 星星月亮 心碎 咦 阴险 疑问 真棒 偷笑 斜眼笑 震惊 略 哈欠 无奈哭 抠鼻 哼 期待 懒得理你 爱心 蜡烛