vue2 自动化部署 shell 脚本

需求场景:在云平台中进行开发时,由于无法连接外网,在部署前端项目时,是通过本地打包再上传到服务器的方式进行部署的。基于这种部署场景,通过 shell 脚本进行部署流程优化,具体如下:

1、服务器上安装 node、git  运行环境。

2、服务上上传 node_modules 包。

3、服务器上编写 shell 脚本。

build.sh 脚本如下:

#!/bin/bash

# 设置 GitLab 仓库的 URL 和本地的存储路径
QIANKUN_PARENT_URL="https://github.com/qiankun-parent.git"
QIANKUN_CHILDREN_URL="https://github.com/qiankun-children.git"
LOCAL_PATH_PARENT="/Users/jqh/Desktop/jqh/code/shell/qiankun-parent"
LOCAL_PATH_CHILDREN="$LOCAL_PATH_PARENT/qiankun-children"
BRANCH_NAME="main"  # 指定分支名称
TARGET_DIR_PARENT="/Users/jqh/Desktop/jqh/code/shell/shch_web"
TARGET_DIR_CHILDREN="$TARGET_DIR_PARENT/front-web"

# 获取当前时间作为时间戳
TIMESTAMP=$(date +%Y%m%d%H%M%S)

# 确保目标目录存在
ensure_target_directory_exists() {
    local TARGET_DIR=$1
    mkdir -p "$TARGET_DIR"
}

# 处理单个仓库
handle_repository() {
    local GITLAB_URL=$1
    local LOCAL_PATH=$2
    local BRANCH_NAME=$3
    local TARGET_DIR=$4
    local TIMESTAMP=$5

    # 检查本地仓库是否存在
    if [ -d "$LOCAL_PATH" ]; then
        # 如果本地仓库存在,则进入该目录并检查是否为 Git 仓库
        cd "$LOCAL_PATH"
        
        # 检查当前目录是否为 Git 仓库
        if [ -d .git ]; then
            echo "Update existing repository '$LOCAL_PATH'..."
            git fetch origin  # 先 fetch 最新的远程分支信息
            
            # 检查远程分支是否存在
            if git rev-parse --verify "origin/$BRANCH_NAME" >/dev/null 2>&1; then
                git checkout "$BRANCH_NAME"  # 切换到指定分支
                git pull origin "$BRANCH_NAME" || {
                    echo "Error: Failed to pull from origin $BRANCH_NAME."
                    exit 1
                }
            else
                echo "Error: Remote branch $BRANCH_NAME does not exist."
                exit 1
            fi
        else
            # 如果本地路径存在但不是 Git 仓库,则删除该目录并重新克隆
            echo "Warning: $LOCAL_PATH is not a Git repository. Removing and cloning again..."
            rm -rf "$LOCAL_PATH"
            git clone -b "$BRANCH_NAME" "$GITLAB_URL" "$LOCAL_PATH"
        fi
    else
        # 如果本地仓库不存在,则克隆新的仓库,并指定分支
        echo "Cloning repository '$LOCAL_PATH'..."
        git clone -b "$BRANCH_NAME" "$GITLAB_URL" "$LOCAL_PATH"
    fi
    
    # 进入仓库目录
    cd "$LOCAL_PATH"
    
    # 检查 node_modules 是否存在
    if [ -d node_modules ]; then
        echo "node_modules directory exists. Proceeding with backup and build..."
    else
        echo "Warning: node_modules directory does not exist. Please upload the local node_modules package."
        exit 1
    fi
    
    # 检查 dist 目录是否存在
    if [ -d dist ]; then
        # 移动 dist 目录并重命名到目标目录
        echo "Moving dist directory before build..."
        mv dist "$LOCAL_PATH/dist_$TIMESTAMP"
        
        # 确保目标目录存在
        ensure_target_directory_exists "$TARGET_DIR"
        
        # 将备份的 dist 目录内容移动到目标目录
        echo "Moving backup build artifacts to target directory..."
        mv "$LOCAL_PATH/dist_$TIMESTAMP" "$TARGET_DIR"
    fi
    
    # 打包
    echo "Building '$LOCAL_PATH'..."
    npm run build
    
    # 检查 dist 目录是否创建成功
    if [ -d dist ]; then
        # 确保目标目录存在
        ensure_target_directory_exists "$TARGET_DIR"
        
        # 将新的 dist 目录内容复制到目标目录
        echo "Copying new build artifacts to target directory..."
        cp -r dist/* "$TARGET_DIR"
    else
        echo "Error: Failed to create dist directory after build."
        exit 1
    fi
}

# 确保目标目录存在
ensure_target_directory_exists "$TARGET_DIR_PARENT"
ensure_target_directory_exists "$TARGET_DIR_CHILDREN"

# 处理 qiankun-parent 仓库
handle_repository "$QIANKUN_PARENT_URL" "$LOCAL_PATH_PARENT" "$BRANCH_NAME" "$TARGET_DIR_PARENT" "$TIMESTAMP"

# 处理 qiankun-children 仓库
handle_repository "$QIANKUN_CHILDREN_URL" "$LOCAL_PATH_CHILDREN" "$BRANCH_NAME" "$TARGET_DIR_CHILDREN" "$TIMESTAMP"

echo "All tasks completed successfully."

解释:

1、服务器的项目部署路径:主项目 /opt/qiankun-parent,子项目 /opt/qiankun-parent/qiankun-children。

2、执行完 build.sh 脚本之后,会自动化地从两个不同的 Git 仓库拉取最新代码、构建项目,并将构建结果部署到指定的目标目录。

  • handle_repository 函数负责处理单个仓库的拉取、构建和部署。
  • 首先检查本地仓库是否存在,如果存在则进入仓库目录并检查是否为 Git 仓库。
  • 如果是 Git 仓库,先 fetch 最新的远程分支信息,然后切换到指定分支并 pull 最新代码。
  • 如果本地路径存在但不是 Git 仓库,则删除该目录并重新克隆。
  • 如果本地仓库不存在,则直接克隆新的仓库。
  • 检查 node_modules 目录是否存在,如果不存在则提示用户上传本地的 node_modules 包。
  • 如果 dist 目录存在,则将其移动并重命名,然后将备份的 dist 目录内容移动到目标目录。
  • 执行 npm run build 命令进行打包。
  • 检查新的 dist 目录是否创建成功,如果成功则将其内容复制到目标目录。
上一篇:Elasticsearch集群和Kibana部署流程


下一篇:spark的学习-05