自动化部署前端shell脚本

Jenkins 使用的版本

shell

#!/bin/bash

# 定义变量
REPO_URL="https://gitee.com/yulin-chen/test_demo.git"    # 你的代码仓库URL
PROJECT_NAME="test_demo"    # 项目名称
BUILD_DIR="/var/lib/jenkins/workspace/${PROJECT_NAME}" # Jenkins工作空间目录
DEPLOY_DIR="/www/wwwroot/test" # 部署目录，确保这个目录存在且有权限
CACHE_DIR="/var/lib/jenkins/cache/${PROJECT_NAME}" # 项目特定的缓存目录

# 确保缓存目录存在
mkdir -p ${CACHE_DIR}

# 步骤1: 清理工作空间
echo "清理工作空间..."
rm -rf ${BUILD_DIR}/*
if [ $? -ne 0 ]; then
    echo "清理工作空间失败"
    exit 1
fi

# 步骤2: 拉取代码
echo "正在从 $REPO_URL 拉取代码..."
cd ${BUILD_DIR}
if [ $? -ne 0 ]; then
    echo "切换到工作空间目录失败"
    exit 1
fi
git init
if [ $? -ne 0 ]; then
    echo "Git初始化失败"
    exit 1
fi
if ! git remote | grep -q "origin"; then
    git remote add origin $REPO_URL
    if [ $? -ne 0 ]; then
        echo "添加远程仓库失败"
        exit 1
    fi
fi
git fetch origin
if [ $? -ne 0 ]; then
    echo "从远程仓库获取数据失败"
    exit 1
fi
git reset --hard origin/master
if [ $? -ne 0 ]; then
    echo "重置本地仓库到远程仓库失败"
    exit 1
fi

# 步骤3: 检查依赖是否需要更新
echo "正在检查依赖是否需要更新..."
if [ -f "${CACHE_DIR}/package-lock.json" ] && [ -f "${BUILD_DIR}/package-lock.json" ]; then
    diff_output=$(diff ${CACHE_DIR}/package-lock.json ${BUILD_DIR}/package-lock.json)
    if [ -n "${diff_output}" ]; then
        echo "package-lock.json 有差异，需要更新依赖:"
        # echo "${diff_output}"
        # 更新缓存
        cp ${BUILD_DIR}/package-lock.json ${CACHE_DIR}/package-lock.json
        cp -R ${BUILD_DIR}/node_modules ${CACHE_DIR}/
        npm install
        if [ $? -ne 0 ]; then
            echo "安装依赖失败"
            exit 1
        fi
    else
        echo "package-lock.json 无差异，跳过依赖安装"
        # 从缓存中恢复 node_modules
        cp -R ${CACHE_DIR}/node_modules ${BUILD_DIR}/
    fi
else
    echo "缓存中不存在 package-lock.json 或本地 package-lock.json，需要更新依赖"
    npm install
    if [ $? -ne 0 ]; then
        echo "安装依赖失败"
        exit 1
    fi
    cp ${BUILD_DIR}/package-lock.json ${CACHE_DIR}/package-lock.json
    cp -R ${BUILD_DIR}/node_modules ${CACHE_DIR}/
fi

# 步骤4: 构建项目
echo "正在构建项目..."
npm run build
if [ $? -ne 0 ]; then
    echo "构建项目失败"
    exit 1
fi

# 步骤5: 检查部署目录
echo "检查部署目录..."
if [ ! -d "$DEPLOY_DIR" ]; then
    echo "部署目录不存在，正在创建..."
    mkdir -p $DEPLOY_DIR
    if [ $? -ne 0 ]; then
        echo "创建部署目录失败"
        exit 1
    fi
fi

# 步骤6: 部署项目
echo "正在部署项目..."
if [ -d "dist" ]; then
    cp -R dist/* $DEPLOY_DIR
    if [ $? -ne 0 ]; then
        echo "部署项目失败"
        exit 1
    fi
else
    echo "构建输出目录不存在"
    exit 1
fi

# 完成
echo "部署完成！"
exit 0

但是如果把这个脚本拿到宝塔里面的webhooks插件就会报错各种权限问题，下面贴一个简单粗暴的，不需要去手动修改文件权限，脚本自己去做，当然这样不是很安全，适合个人新手玩家自己去使用

shell

#!/bin/bash
# 确保文件权限正确
chown -R root:root /www/wwwroot/sc/blog
chmod -R 755 /www/wwwroot/sc/blog

# 将 pnpm 的路径添加到 PATH 环境变量中
export PATH=$PATH:/www/server/nodejs/v20.18.0/bin

# 定义变量
REPO_URL="https://gitee.com/yulin-chen/blog.git"    # 你的代码仓库URL
PROJECT_NAME="blog"    # 项目名称
BUILD_DIR="/www/wwwroot/sc/${PROJECT_NAME}" # 代码空间
DEPLOY_DIR="/www/wwwroot/${PROJECT_NAME}" # 部署目录，确保这个目录存在且有权限
CACHE_DIR="/www/wwwroot/sc/cache/${PROJECT_NAME}" # 项目特定的缓存目录

# 确保缓存目录存在
mkdir -p ${CACHE_DIR}

# 步骤1: 清理工作空间
echo "清理工作空间..."
rm -rf ${BUILD_DIR}/*
if [ $? -ne 0 ]; then
    echo "清理工作空间失败"
    exit 1
fi

# 步骤2: 拉取代码
echo "正在从 $REPO_URL 拉取代码..."
cd ${BUILD_DIR}
if [ $? -ne 0 ]; then
    echo "切换到工作空间目录失败"
    exit 1
fi
set -x
echo "Git全局配置:"
git config --global --list
echo "当前用户：$(whoami)"
echo "当前路径：$(pwd)"
echo "环境变量 PATH：$PATH"
git config --global --add safe.directory /www/wwwroot/sc/blog
git init
if [ $? -ne 0 ]; then
    echo "Git初始化失败"
    exit 1
fi
git config --add safe.directory /www/wwwroot/sc/blog
echo "当前仓库状态:"
git status
if ! git remote | grep -q "origin"; then
    if ! output=$(git remote add origin "$REPO_URL" 2>&1); then
        echo "添加远程仓库失败: $output"
        exit 1
    else
        echo "远程仓库添加成功"
    fi
else
    echo "远程仓库已存在"
fi
set +x

git fetch origin
if [ $? -ne 0 ]; then
    echo "从远程仓库获取数据失败"
    exit 1
fi
git reset --hard origin/master
if [ $? -ne 0 ]; then
    echo "重置本地仓库到远程仓库失败"
    exit 1
fi

# 步骤3: 检查依赖是否需要更新
echo "正在检查依赖是否需要更新..."
if [ -f "${CACHE_DIR}/pnpm-lock.yaml" ] && [ -f "${BUILD_DIR}/pnpm-lock.yaml" ]; then
    diff_output=$(diff ${CACHE_DIR}/pnpm-lock.yaml ${BUILD_DIR}/pnpm-lock.yaml)
    if [ -n "${diff_output}" ]; then
        echo "pnpm-lock.yaml 有差异，需要更新依赖:"
        # echo "${diff_output}"
        # 更新缓存
        cp ${BUILD_DIR}/pnpm-lock.yaml ${CACHE_DIR}/pnpm-lock.yaml
        cp -R ${BUILD_DIR}/node_modules ${CACHE_DIR}/
        echo "正在安装依赖..."
        if ! pnpm install 2>&1 | tee install_log.txt; then
            echo "安装依赖失败"
            cat install_log.txt
            exit 1
        fi
    else
        echo "pnpm-lock.yaml 无差异，跳过依赖安装"
        # 从缓存中恢复 node_modules
        cp -R ${CACHE_DIR}/node_modules ${BUILD_DIR}/
    fi
else
    echo "缓存中不存在 pnpm-lock.yaml 或本地 pnpm-lock.yaml，需要更新依赖"
    echo "正在安装依赖..."
    if ! pnpm install 2>&1 | tee install_log.txt; then
        echo "安装依赖失败"
        cat install_log.txt
        exit 1
    fi
    cp ${BUILD_DIR}/pnpm-lock.yaml ${CACHE_DIR}/pnpm-lock.yaml
    cp -R ${BUILD_DIR}/node_modules ${CACHE_DIR}/
fi

# 步骤4: 构建项目
echo "正在构建项目..."
if ! pnpm run build 2>&1 | tee build_log.txt; then
    echo "构建项目失败"
    cat build_log.txt
    exit 1
fi

# 步骤5: 检查部署目录
echo "检查部署目录..."
if [ ! -d "$DEPLOY_DIR" ]; then
    echo "部署目录不存在，正在创建..."
    mkdir -p $DEPLOY_DIR
    if [ $? -ne 0 ]; then
        echo "创建部署目录失败"
        exit 1
    fi
fi

# 步骤6: 部署项目
echo "正在部署项目..."
if [ -d ".vitepress/dist" ]; then
    cp -R .vitepress/dist/* $DEPLOY_DIR
    if [ $? -ne 0 ]; then
        echo "部署项目失败"
        exit 1
    fi
else
    echo "构建输出目录不存在"
    exit 1
fi

# 完成
echo "部署完成！"
exit 0

ssh版本

shell

#!/bin/bash
# 确保文件权限正确
chown -R root:root /www/wwwroot/sc/blog
chmod -R 755 /www/wwwroot/sc/blog

# 将 pnpm 的路径添加到 PATH 环境变量中
export PATH=$PATH:/www/server/nodejs/v20.18.0/bin

# 定义变量
REPO_URL="git@gitee.com:yulin-chen/blog.git"    # 你的代码仓库URL
PROJECT_NAME="blog"    # 项目名称
BUILD_DIR="/www/wwwroot/sc/${PROJECT_NAME}" # 代码空间
DEPLOY_DIR="/www/wwwroot/${PROJECT_NAME}" # 部署目录，确保这个目录存在且有权限
CACHE_DIR="/www/wwwroot/sc/cache/${PROJECT_NAME}" # 项目特定的缓存目录

# 确保缓存目录存在
mkdir -p ${CACHE_DIR}

# 步骤1: 清理工作空间
echo "清理工作空间..."
rm -rf ${BUILD_DIR}/*
if [ $? -ne 0 ]; then
    echo "清理工作空间失败"
    exit 1
fi

# 步骤2: 拉取代码
echo "正在从 $REPO_URL 拉取代码..."
cd ${BUILD_DIR}
if [ $? -ne 0 ]; then
    echo "切换到工作空间目录失败"
    exit 1
fi
set -x
echo "Git全局配置:"
git config --global --list
echo "当前用户：$(whoami)"
echo "当前路径：$(pwd)"
echo "环境变量 PATH：$PATH"
git config --global --add safe.directory /www/wwwroot/sc/blog
git init
if [ $? -ne 0 ]; then
    echo "Git初始化失败"
    exit 1
fi
git config --add safe.directory /www/wwwroot/sc/blog
echo "当前仓库状态:"
git status
if ! git remote | grep -q "origin"; then
    if ! output=$(git remote add origin "$REPO_URL" 2>&1); then
        echo "添加远程仓库失败: $output"
        exit 1
    else
        echo "远程仓库添加成功"
    fi
else
    echo "远程仓库已存在"
fi
set +x

# 禁用主机密钥验证
export GIT_SSH_COMMAND="ssh -o StrictHostKeyChecking=no"

# 测试 SSH 连接
echo "测试 SSH 连接..."
ssh -T git@gitee.com

# 获取远程仓库数据
echo "从远程仓库获取数据..."
git fetch origin
if [ $? -ne 0 ]; then
    echo "从远程仓库获取数据失败"
    exit 1
fi
git reset --hard origin/master
if [ $? -ne 0 ]; then
    echo "重置本地仓库到远程仓库失败"
    exit 1
fi

# 步骤3: 检查依赖是否需要更新
echo "正在检查依赖是否需要更新..."
if [ -f "${CACHE_DIR}/pnpm-lock.yaml" ] && [ -f "${BUILD_DIR}/pnpm-lock.yaml" ]; then
    diff_output=$(diff ${CACHE_DIR}/pnpm-lock.yaml ${BUILD_DIR}/pnpm-lock.yaml)
    if [ -n "${diff_output}" ]; then
        echo "pnpm-lock.yaml 有差异，需要更新依赖:"
        cp ${BUILD_DIR}/pnpm-lock.yaml ${CACHE_DIR}/pnpm-lock.yaml
        rm -rf ${BUILD_DIR}/node_modules
        echo "正在安装依赖..."
        if ! pnpm install 2>&1 | tee install_log.txt; then
            echo "安装依赖失败"
            cat install_log.txt
            exit 1
        fi
    else
        echo "pnpm-lock.yaml 无差异，恢复缓存中的 node_modules"
        rm -rf ${BUILD_DIR}/node_modules
        cp -R ${CACHE_DIR}/node_modules ${BUILD_DIR}/
        # 检查缓存完整性
        echo "检查缓存完整性..."
        if ! pnpm install --frozen-lockfile 2>&1 | tee install_log.txt; then
            echo "安装依赖失败"
            cat install_log.txt
            exit 1
        fi
    fi
else
    echo "缓存中不存在 pnpm-lock.yaml 或本地 pnpm-lock.yaml，需要更新依赖"
    rm -rf ${BUILD_DIR}/node_modules
    echo "正在安装依赖..."
    if ! pnpm install 2>&1 | tee install_log.txt; then
        echo "安装依赖失败"
        cat install_log.txt
        exit 1
    fi
    cp ${BUILD_DIR}/pnpm-lock.yaml ${CACHE_DIR}/pnpm-lock.yaml
    cp -R ${BUILD_DIR}/node_modules ${CACHE_DIR}/
fi

# 步骤4: 构建项目
echo "正在构建项目..."
if ! pnpm run build 2>&1 | tee build_log.txt; then
    echo "构建项目失败"
    cat build_log.txt
    exit 1
fi

# 步骤5: 检查部署目录
echo "检查部署目录..."
if [ ! -d "$DEPLOY_DIR" ]; then
    echo "部署目录不存在，正在创建..."
    mkdir -p $DEPLOY_DIR
    if [ $? -ne 0 ]; then
        echo "创建部署目录失败"
        exit 1
    fi
fi

# 步骤6: 部署项目
echo "正在部署项目..."
if [ -d ".vitepress/dist" ]; then
    cp -R .vitepress/dist/* $DEPLOY_DIR
    if [ $? -ne 0 ]; then
        echo "部署项目失败"
        exit 1
    fi
else
    echo "构建输出目录不存在"
    exit 1
fi

# 完成
echo "部署完成！"
exit 0