【Jenkins】Docker搭建Jenkins并部署前后端分离项目SpringBoot+Vue

原创

已于 2025-07-02 10:33:19 修改 · 383 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#jenkins #运维 #maven #java #linux #git #ci/cd

于 2025-06-20 17:27:09 首次发布

本方案基于 Docker 搭建 Jenkins 持续集成环境，结合 Shell 脚本实现前端 Vue 与后端 Spring Boot 项目的自动化构建、备份、部署及日志管理，支持多版本备份、远程宿主机部署，适用于前后端分离项目的一体化自动交付流程。

Docker安装Jenkins

docker-compose.yml

version: '3.8'

services:
  jenkins:
    image: jenkins/jenkins:2.515
    container_name: jenkins
    user: root
    ports:
      - "8025:8080"
      - "8026:50000"
    environment:
      - TZ=Asia/Shanghai
    volumes:
      - /opt/Jenkins_dcoker/jenkins_home:/var/jenkins_home
      - /opt/Jenkins_dcoker/jenkins_root:/root
      - /opt/Jenkins_dcoker/jenkins_root/.m2:/root/.m2
      - /var/run/docker.sock:/var/run/docker.sock
      - /usr/lib/jvm/java-1.8.0:/environment/jdk  #jdk环境
      - //home/jekins/apache-maven-3.3.9:/environment/maven  #maven环境
      - /opt/dlb:/deploy/java          # 映射 Java 部署目录
      - /opt/DLB/xxcj:/deploy/vue            # 映射 Vue 构建产物目录
    restart: unless-stopped

一、部署前端vue

在这里插入图片描述

1、配置git仓库

在这里插入图片描述

2、设置使用NodeJs环境编译代码

在这里插入图片描述

3、设置编译部署脚本

在这里插入图片描述

#!/bin/bash

# 部署路径
DEPLOY_PATH="/deploy/vue" # 这里是docker的映射路径：/opt/DLB/xxcj:/deploy/vue 
WEB_PATH="${DEPLOY_PATH}/web"

# 当前日期时间，格式为年月日时分
TIMESTAMP=$(date +"%Y%m%d%H%M")

# 编译Vue项目
cd ruoyi-ui

# 清理dist目录
if [ -d "dist" ]; then
  echo "清理旧的dist目录"
  rm -rf dist
fi

npm i
npm run build:prod

# 检查编译是否成功
if [ ! -d "dist"