在代码仓库创建.gitlab-ci.yml文件

stages:
  - package
  - deploy

default:
  cache: &global_cache # 全局缓存
    key: ${CI_COMMIT_REF_NAME} # 缓存key
    paths:
      - dist/dist.tar # 缓存路径

package:
  stage: package
  cache:
    - <<: *global_cache # 使用全局缓存
      policy: push # 缓存策略
  script:
    - export NODE_OPTIONS=--openssl-legacy-provider # 设置node选项
    - yarn # 安装依赖
    - yarn build # 构建
    - cd dist && tar -czf dist.tar * && cd .. # 打包

deploy:
  stage: deploy
  cache:
    - <<: *global_cache # 使用全局缓存
      policy: pull
  only:
    - main
  script:
    - scp dist/dist.tar 192.168.1.100:/data/deploy/ # 上传到服务器
    - ssh 192.168.1.100 "/root/script/deploy_html.sh dist dist.tar" # 执行部署脚本
  after_script:
    - /usr/local/bin/wechat_v2 ${CI_PROJECT_NAME} ${CI_COMMIT_REF_NAME} ${GITLAB_USER_EMAIL} ${CI_PIPELINE_URL} ${CI_JOB_STATUS} 192.168.1.100 # 发送通知
  when: manual # 手动触发

服务器部署脚本

#!/bin/bash
set -e -u -o pipefail # 设置错误处理

PROJECT=${1} # 项目名称
FILE_NAME=${2} # 文件名称
APP_BASE_DIR=/data/application/web # 应用基础目录
APP_DIR=${APP_BASE_DIR}/${PROJECT} # 应用目录
NOW=$(date +%Y-%m-%d-%H%M%S) # 当前时间
BACKUP_DIR=/data/backup/${NOW} # 备份目录

if [ $# -eq 3 ]; then # 如果参数数量等于3
  APP_DIR=${APP_BASE_DIR}/${PROJECT}/${3} # 设置应用目录
fi

DEPLOY_PATH=/data/deploy

echo =======================================开始发布=========================================
echo 代码包: ${DEPLOY_PATH}/${FILE_NAME}
echo 代码路径: ${APP_DIR}
echo 备份路径: ${BACKUP_DIR}
echo ======================================================================================



echo  1. backup the old version.
mkdir -p ${BACKUP_DIR} ${APP_DIR} # 创建备份目录和应用目录
mv -f ${APP_DIR}/* ${BACKUP_DIR}/ # 备份旧版本

echo  2. deploy the ${APP_DIR}.
mkdir -p ${APP_DIR}
tar xf ${DEPLOY_PATH}/${FILE_NAME} -C ${APP_DIR} # 解压部署包


tree -L 1 ${APP_DIR} # 查看应用目录结构

echo 3. remove tar....  
rm -f ${DEPLOY_PATH}/${FILE_NAME} # 删除部署包