🐻❄️🐻❄️🐻❄️🐻❄️🐻❄️🐻❄️
- 🐰部署Jenkins
- 🐇安装node.js
- 🥕上传到linux并解压
- 🥕配置Jenkins环境变量
- 🐇jenkins 创建任务
- 🐇部署方式
- 🥕第一种 (npm run build)打包的形式
- 🐼执行脚本 build Steps
- 🥕第二种 (npm run test)直接启动的形式
- 🐼执行脚本 build Steps
- 🐼vue jenkins shell 脚本 (jenkins-web.sh)
- 🥕前面两种的启动方式
- 🥕第三种使用docker镜像部署
🐰部署Jenkins
如何在linux上安装jenkins可以看上一篇
linux安装jenkins(详细步骤)
🐇安装node.js
建议最好跟你本地安装版本一致,减少没有必要的麻烦:node.js官网
可以选择当前版本 可以选择自己需要的nodejs版本
🥕上传到linux并解压
# 选择一个位置存放
cd /usr/local/
# 创建一个文件夹 并把刚才下载好的压缩包上传到对应路径
mkdir node
# 上传完成后 解压文件
tar -xvf node-v18.17.0-linux-x64.tar.xz
# 配置环境变量
vim /etc/profile
export NODE_HOME=/usr/local/node/node-v18.17.0-linux-x64
export PATH=$NODE_HOME/bin:$PATH
# 刷新
source /etc/profile
# 检查是否配置正确
node -v
npm -v
像我这样显示就是没有问题的了
🥕配置Jenkins环境变量
一定要配置Jenkins环境变量
不然执行脚本npm
命令报错会报npm: command not found
🐇jenkins 创建任务
- 选择创建一个任务
- 填写项目名称
设置一下构建历史保留天数,不然很容易导致磁盘满了
- 填写你的git 地址 并选择账号 并选择需要的分支
- 没有账号的添加 凭证
- 添加完成之后, 就可以在下拉选里面选了
- 这里勾选上定位具体错误
🐇部署方式
🥕第一种 (npm run build)打包的形式
🐼执行脚本 build Steps
# jenkins 拉取代码存放地址
cd /var/lib/jenkins/workspace/web
npm install --force
npm run build
# ops 为 dist
zip -r ops.zip ops
# nginx 代理路径地址
cd /data/apps/nginx/html
rm -rf ops
rm -f ops.zip
cp -f /var/lib/jenkins/workspace/web/ops.zip /data/apps/nginx/html
unzip -o ops.zip
# 重启nginx
docker restart nginx
这种方式用了nginx,需要安装nginx的小伙伴可以参考这篇
🥕第二种 (npm run test)直接启动的形式
🐼执行脚本 build Steps
- 第一个脚本
#!/bin/bash
# workspace后面的改成你自己项目文件的位置
cd /var/lib/jenkins/workspace/web
npm install --force
- 第二个脚本
#!/bin/bash
# 脚本位置 放在那个位置写那个
cd /opt/java/web
# 防止jenkins 杀死子线程
export EXEC=./jenkins-web.sh restart
$EXEC stop
sleep 5
BUILD_ID=dontKillMe $EXEC start
🐼vue jenkins shell 脚本 (jenkins-web.sh)
#!/bin/sh
export path=/var/lib/jenkins/workspace/web
export port=9040
case "$1" in
start)
if(true);then
echo "--------web开始启动--------------"
cd $path
nohup npm run test >/dev/null 2>&1 &
pid=`lsof -i:$port|grep "LISTEN"|awk '{print $2}'`
until [ -n "$pid" ]
do
pid=`lsof -i:$port|grep "LISTEN"|awk '{print $2}'`
sleep 3
done
echo "web pid is $pid"
echo "--------web 启动成功--------------"
fi
echo "===startAll success==="
;;
stop)
P_ID=`lsof -i:$port|grep "LISTEN"|awk '{print $2}'`
if [ "$P_ID" == "" ]; then
echo "===web process not exists or stop success"
else
kill -9 $P_ID
echo "web killed success"
fi
echo "===stopAll success==="
;;
restart)
$0 stop
sleep 2
$0 start
echo "===restartAll success==="
;;
esac
exit 0
🥕前面两种的启动方式
- 直接保存
- 点这里启动即可
- 点构建历史即可查看 控制台输出
🥕第三种使用docker镜像部署
docker环境安装
# 打包镜像 注意后面的. 我是Dockerfile是放在当前面目录
docker build -t <image_name>:<tag> .
# 登入私有仓库
docker login registry.<region>.aliyuncs.com -u <DOCKER_USER_VAR> -p <DOCKER_PASSWORd_VAR>
# 我这里推送的是阿里云私有仓库,根据自己的情况替换
# 使用命令 docker tag 对镜像添加新的标签,
# 格式为 <registry>/<repository>:<tag>。其中 <registry> 是阿里云容器服务提供的镜像仓库地址,
# <repository> 是自定义的存储库名称,<tag> 则是版本标签
docker tag <image_name>:<tag> registry.<region>.aliyuncs.com/<namespace>/<repository>:<tag>
# 推送镜像
docker push registry.<region>.aliyuncs.com/<namespace>/<repository>:<tag>
# Dockerfile
FROM nginx
LABEL maintainer=hrd
COPY dist /usr/share/nginx/html/
EXPOSE 80