【shell】vue项目自动化打包

banner图

【shell】vue项目自动化打包

文章类型:shell

发布时间:2023-07-04

shell脚本 vue项目自动化打包

#!/bin/sh


dir_name="project_dir_name" # 克隆项目到本地的文件夹名
dist_dir_name="project_build_dir_name" # 项目构建完后所在的文件夹名
git_path="git clone url" # 项目的 git clone 地址
git_branch="branch name" # 项目的 git 分支


# 项目本就是一级目录 two_dir_name、two_back_dir_name 则为空 ""
two_dir_name="VUE" # 项目在git仓库中的二级目录名
two_back_dir_name="../" # 若项目在git仓库中的二级目录中需要多返回一级


vue_build_dir_name="dist" # vue项目配置打包后的目录名 一般是 dist
vue_build_script="build" # vue项目配置打包的脚本 一般是 build


rm -rf ${dir_name} ${dist_dir_name}
echo "正在克隆代码..."
git clone ${git_path} ${dir_name} -b ${git_branch} --depth=1
echo "克隆完成"
cd ${dir_name}/${two_dir_name}
echo "正在安装项目依赖..."
npm install
echo "安装项目依赖完成"
echo "正在打包..."
npm run ${vue_build_script}
echo "打包完成"
echo "正在整理资源..."
tar cvf ${dist_dir_name}.tar -C ./${vue_build_dir_name} .
mv ${dist_dir_name}.tar ../${two_back_dir_name}
cd ../${two_back_dir_name}
mkdir ${dist_dir_name}
tar xvf ${dist_dir_name}.tar -C ${dist_dir_name}
rm -rf ${dir_name} ${dist_dir_name}.tar
echo "打包资源文件见 ${dist_dir_name} 目录"