docker自动化部署前端项目实战一

最新推荐文章于 2025-07-08 16:21:07 发布

原创

最新推荐文章于 2025-07-08 16:21:07 发布 · 906 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍了一种使用服务器上的Node脚本监听GitHub仓库webhook，结合Docker自动化部署前端项目的实践方法。详细阐述了环境配置、webhook创建、Dockerfile编写、http服务器设置以及域名访问等步骤。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

docker自动化部署前端项目实战一

本文适用于个人项目，如博客、静态文档，不涉及后台数据交互，以部署文档为例。

思路

利用服务器node脚本，监听github仓库webhook push事件触发post请求，自动拉取最新代码，再用docker接管项目编译、部署。

环境

本文使用云服务器搭建，环境版本：

OS：CentOS Linux release 8.2.2004
docker：19.03.12
node：14.5.0
git：2.18.4

云服务器如果没有安装以下环境，需要安装。

docker
node
pm2
git

docker

# Step 1: 安装必要的一些系统工具
sudo yum install -y yum-utils
# Step 2: 添加软件源信息，使用阿里云镜像
sudo yum-config-manager --add-repo http://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo
# Step 3: 安装 docker-ce
sudo yum install docker-ce docker-ce-cli containerd.io
# Step 4: 开启 docker服务
sudo systemctl start docker
# Step 5: 运行 hello-world 项目
sudo docker run hello-world

不出意外，出现==hello world==，docker安装成功

git

从代码仓库拉取最新代码

yum install git

node

创建js脚本。使用nvm管理node版本，先安装nvm

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.34.0/install.sh | bash

将nvm设置环境变量

export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"  # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"  # This loads nvm bash_completion

通过 nvm 安装最新版 node