jenkins 本地自动化打包前端vue2项目

本文指导如何在Windows11环境中安装Jenkins,包括解决JDK版本问题,配置Git及密码,验证构建,以及设置构建后脚本自动打包部署到Nginx。详细步骤包括安装新JDK,配置工作空间,管理GitHub凭证,以及编写Shell脚本来打包和部署Vue项目。
摘要由CSDN通过智能技术生成

step1: 安装 jenkins

当前环境:windows11,jdk1.8+,maven3.5.6,node12.13.0(当前vue项目可以本地跑起来)。
参考链接:
jenkins Plugin: https://plugins.jenkins.io/
– 官方步骤: https://www.jenkins.io/doc/book/installing/windows/
– 问题链接:【windows配置】windows11家庭版添加本地安全策略(亲测有效)
– 查看链接: 【jenkins部署】一文弄懂自动打包部署(前后台)
– 查看链接:使用Jenkins实现前端自动化打包部署(Linux版本)
– nginx 相关命令: https://www.jb51.net/server/295622hwb.htm

1.  到官网下载最新的 Jenkins版本

最好直接下载最新的,不然有些插件不好下载
   - 下载的 windows 直接安装的包,需要看下 JDK版本,本人在安装时发现JDK版本低,给取消了。
   -  可以直接下载  war包,可以直接java命令跑或者tomcat 放到 webapps 下面,启动 tomcat,到 http://localhost:XXXX/jenkins文件名 下即可。但是安装还是不可避免 JDK版本低问题。
   - 安装新的 JDK 版本,大概就是下载安装之后,改变一下 JAVA_HOME 等相关路径。

2. 按照指引一步步安装即可。

注意,第一步输入下对应的”管理员密码“
   - 详细参考:https://zhuanlan.zhihu.com/p/640788933
https://link.zhihu.com/?target=http%3A//mirror.esuni.jp/jenkins/updates/update-center.json

3. 更改 jenkins 工作空间。

正常是在 C:\Users\user\.jenkins下面。
   - 配置环境变量JENKINS_HOME
   - 如果原 工作空间已有文件,移到最新配置工作空间。
   - 重新启动即可。 可以在对应配置中查看到工作空间:

step2: 配置 git 及密码

1. 到对应模块 Manage Jenkins > System 下进行配置,可以配置 gitee或者 github

2. 添加令牌:

注意:Credentials可以是用户名和密码

step3: 验证是否可以正常构建

1.  新建项目


2. 配置项目


        - 配置好源码管理,可以用账户密码等或者将仓库开放
image.png

3. build Now

4. 对应日志查看

- 点击下图出现的记录,

   - 即可查看控制台输出,实际情况的成败也是看这里

step4: 配置构建后脚本

构建后需要打包,放到 nginx对应目录下即可,windows选择下面种类添加:

说明:由于本人 shell 水平有限,暂时达到这样的效果
    - 打包脚本:

# windows shell1 (脚本1)
echo "start build...."
cd ./tui(vue)
# npm install 有些会直接报错
# 复制一遍就行,可以手动操作
# xcopy D:\xxx\node_modules D:\jenkinsSpace\workspace\tui(vue)\node_modules\  /E /I /Y
npm run build

- 运行脚本:

# windows shell2 (脚本2)
# 如果Nginx 没有开着,返回会 failure; 即使显示运行成功,也可能nginx 启动失败,需手动启动。
echo "start deploy...."
rmdir /S /Q D:\nginx-1.10.2\html\tui
xcopy D:\jenkinsSpace\workspace\tui\dist D:\nginx-1.10.2\html\tui\  /E /I /Y
D:
cd D:/nginx-1.10.2
# 这边 nginx 控制不大知道是否成功,也可以直接手动处理
# nginx -s stop
# nginx -s reload
# start nginx

此文章仅供学习,为个人原创,如需转载请标明作者。

  • 21
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值