Jenkins前后端部署

下载

Jenkins 的安装和设置

加载插件太慢,更换镜像地址

http://mirrors.tuna.tsinghua.edu.cn/jenkins/updates/update-center.json

工具配置jdk和maven

安装Deploy to container Plugin

Git后端部署

新建Item

源码管理

Build Steps

clean package -Dmaven.test.skip=true

Build Now

控制台输出

Git前端部署

新建Item

源码管理

Build Now

安装依赖

切换到 C:\ProgramData\Jenkins\.jenkins\workspace\RuoYi-Vue3
执行 yarn --registry=https://registry.npm.taobao.org

修改配置

Build Steps

Execute Windows batch command

yarn build:prod

Build Now

安装svn插件

SVN后端部署

新建Item

源码管理

增加构建步骤

Invoke top-level Maven targets

clean package -Dmaven.test.skip=true

Build Now

SVN前端部署

控制台输出

### 使用 Jenkins 部署前后端分离项目的解决方案 在使用 Jenkins 部署前后端分离项目时,通常需要分别处理前端和后端的构建与部署流程。以下是一个完整的解决方案,结合了提供的引用内容和专业实践。 #### 1. 后端项目部署 后端项目通常以 JAR 或 WAR 包的形式进行打包和部署。以下是具体步骤: - **下载并启动后端项目** 将后端项目的 WAR 或 JAR 包上传到服务器,并通过命令启动。例如: ```bash nohup java -jar jenkins.war > ../logs/jenkins.log 2>&1 & ``` 此命令将后台运行后端项目,并将日志输出到指定文件中[^2]。 - **Jenkins 配置后端项目** 在 Jenkins 中创建一个自由风格的项目,配置如下: - 输入 Git 地址并添加 Git 账户。 - 增加构建步骤,调用 Maven 目标(如 `clean package`)以生成 JAR 包。 - 如果需要,增加额外的构建步骤执行 Shell 脚本,用于停止旧服务并启动新服务。 - **Shell 脚本示例** 用于停止旧服务并启动新服务的脚本可以参考以下内容: ```bash # 停止旧服务 ps aux | grep vueblog-0.0.1-SNAPSHOT.jar | grep -v "grep" | awk '{print "kill -9 "$2}' | sh # 启动新服务 export BUILD_ID=dontKillMe nohup java -jar /path/to/vueblog-0.0.1-SNAPSHOT.jar > logTest.log 2>&1 & ``` 注意:`export BUILD_ID=dontKillMe` 是为了防止 Jenkins 杀死子进程[^3]。 #### 2. 前端项目部署 前端项目通常基于 Vue、React 等框架,需要通过构建工具(如 npm 或 yarn)生成静态资源文件。以下是具体步骤: - **安装依赖环境** 确保服务器上已安装 Node.js 和相关构建工具(如 npm)。可以在 Jenkins 的全局工具配置中设置 Node.js 的路径。 - **Jenkins 配置前端项目** 创建一个新的自由风格项目,配置如下: - 输入 Git 地址并添加 Git 账户。 - 增加构建步骤,执行 npm 构建命令(如 `npm run build`)以生成静态资源文件。 - 增加额外的构建步骤,将生成的静态资源文件复制到目标路径(如 Nginx 的 html 目录)。 - **Shell 脚本示例** 用于前端项目构建和部署的脚本可以参考以下内容: ```bash cd /path/to/frontend npm install npm run build # 将生成的 dist 文件夹复制到 Nginx 的 html 目录 rsync -av --delete ./dist/ /usr/share/nginx/html/ # 重新加载 Nginx 配置 /usr/local/nginx/sbin/nginx -s reload ``` #### 3. 自动化流程整合 为了实现一键部署,可以将前端和后端的 Jenkins 项目关联起来,通过以下方式实现: - 在后端项目的 Jenkins 配置中,添加“构建后操作”,触发前端项目的构建。 - 确保前后端项目的 Git 地址正确,并且构建步骤无误。 #### 4. 示例完整脚本 以下是一个完整的前后端部署脚本示例: ```bash # 后端部署 echo "Stopping old backend service..." ps aux | grep vueblog-0.0.1-SNAPSHOT.jar | grep -v "grep" | awk '{print "kill -9 "$2}' | sh echo "Starting new backend service..." export BUILD_ID=dontKillMe nohup java -jar /path/to/vueblog-0.0.1-SNAPSHOT.jar > logTest.log 2>&1 & # 前端部署 echo "Building frontend project..." cd /path/to/frontend npm install npm run build echo "Copying frontend files to Nginx directory..." rsync -av --delete ./dist/ /usr/share/nginx/html/ echo "Reloading Nginx configuration..." /usr/local/nginx/sbin/nginx -s reload ``` ###
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值