jenkins部署jeecg-boot3.1(前後端)自動化

scott發表於2022-05-23

tip:

我是使用我的騰訊雲輕量應用伺服器做的本次實戰

(作業系統:CentOS 7.6 64bit)

(主機規格:CPU: 4核 記憶體: 4GB)這個配置起前端有點帶不動-_-,建議8G記憶體,這個問題我反覆測試很多次。一跑npm 就開始瘋狂佔資源,然後作業系統記憶體不夠直接把jenkins的程式都給殺了。所以如果你也是4g或者2g記憶體,儘量不要有其他多餘的應用或者容器在機器上執行。

1. Ready

1.1. jenkins

tip:如果已經成功啟動訪問jenkins,可以直接跳過1.1
a. getjenkins.war

​ 啟動:

nohup java -jar jenkins.war --httpPort=7999 >output 2>&1 &
b.docker(不推薦,大佬隨意)
docker pull jenkins/jenkins
docker run \
  -u root \
  --rm \
  -d \
  -p 7999:8080 \
  -p 50000:50000 \
  -v /jenkins-data:/var/jenkins_home \
  -v /var/run/docker.sock:/var/run/docker.sock \
  jenkinsci/blueocean

a與b的結果都是將jenkins啟動,也是我們的目標,本篇文章採用war包方式,也建議war包的方式,docker啟的話,裡面jdk是11,而我機器的jdk是8,同時專案jdk也是8,換11的話,天知道會出什麼問題。 啟動之後,訪問一下,上述例子中我對映了7999埠,同時我的騰訊雲防火牆也開放了7999這個埠,下面是訪問圖例:

在這裡插入圖片描述

根據提示貼上密碼,如果是war包啟動的就直接複製頁面提示的路徑就可以,輸入命令,即得密碼

cat /var/jenkins_home/secrets/initialAdminPassword

如果是docker啟動的,上面的-v掛載了一個路徑 /jenkins-data 這裡面的檔案就是容器裡jenkins_home裡面的檔案,故路徑就變成了

cat /jenkins-data/secrets/initialAdminPassword

隨後,輸入得到的密碼,進入,選擇安裝推薦的外掛

在這裡插入圖片描述

接下來,就等待機器安裝,然後建立第一個賬戶,然後jenkinsURL預設是啥就是啥(反正可以改的),可能會提示重啟,如果沒有不管。進入jenkins

在這裡插入圖片描述

到這裡,先停一下。右上角紅色的1不管。

1.2. gitee(github和gitlab都類似的,差別不大)

裝外掛: (系統管理)Manage System -> (外掛管理)Manage Plugins -> (可選的外掛)Available,在 Filter 中搜尋 Gitee,Jersey2 API這兩個外掛,然後分別選中,然後點install without restart。

等待安裝完畢即可。

之後,就是配置gitee了

系統管理—>系統配置---->gitee配置

在這裡插入圖片描述
在這裡插入圖片描述

在 連結名 中輸入 Gitee 或者你想要的名字

Gitee 域名 URL 中輸入碼雲完整 URL地址: https://gitee.com (碼雲私有化客戶輸入部署的域名)

證照令牌 中如還未配置碼雲 APIV5 私人令牌,點選 Add - > Jenkins

Domain 選擇 全域性憑據

Kind 選擇 Gitee API 令牌

Scope 選擇你需要的範圍

Gitee API Token 輸入你的碼雲私人令牌,獲取地址:https://gitee.com/profile/per...
這個令牌建議儲存在雲筆記之類的東西上,方便自己以後用

ID, Descripiton 中輸入你想要的 ID 和描述即可。然後點新增,然後回來選擇剛剛新增的令牌,點選測試連結,出現成功即可。

在這裡插入圖片描述

1.3 maven

我是在宿主機安裝的maven,這樣後面shell命令裡面可以直接用mvn

maven的話最好是使用jeecg官方推薦的

yum -y install maven

找一下settings檔案

mvn -v

就可以看到maven home 然後在maven home的conf目錄下就有settings檔案了。

在這裡插入圖片描述

然後替換一下 settings.xml檔案,或者直接改也行(就下面這部分):

 <mirrors>
       <mirror>
            <id>nexus-aliyun</id>
            <mirrorOf>*,!jeecg,!jeecg-snapshots,!getui-nexus</mirrorOf>
            <name>Nexus aliyun</name>
            <url>http://maven.aliyun.com/nexus/content/groups/public</url>
        </mirror>
 </mirrors>

1.4 npm

npm是裝在宿主機的。因為我是war包直接起的。所以可以直接在後面shell命令裡面用npm,如果是docker啟動的,容器裡面是沒有node的,而且容器裡面jdk是11,就…不是很方便,所以我前面建議war包直接起。

npm config set registry https://registry.npmmirror.com
npm config get registry

在這裡插入圖片描述

我的版本:

在這裡插入圖片描述

1.5 修改前端Dockerfile檔案與env檔案

jeecg-boot/ ant-design-vue-jeecg / Dockerfile:

FROM nginx
MAINTAINER jeecgos@163.com
VOLUME /tmp
ENV LANG en_US.UTF-8
RUN echo "server {  \
                      listen       8000; \
                      location ^~ /jeecg-boot { \
                      proxy_pass              http://127.0.0.1:8080/jeecg-boot/; \
                      proxy_set_header        Host jeecg-boot-system; \
                      proxy_set_header        X-Real-IP \$remote_addr; \
                      proxy_set_header        X-Forwarded-For \$proxy_add_x_forwarded_for; \
                  } \
                  #解決Router(mode: 'history')模式下,重新整理路由地址不能找到頁面的問題 \
                  location / { \
                     root   /var/www/html/; \
                      index  index.html index.htm; \
                      if (!-e \$request_filename) { \
                          rewrite ^(.*)\$ /index.html?s=\$1 last; \
                          break; \
                      } \
                  } \
                  access_log  /var/log/nginx/access.log ; \
              } " > /etc/nginx/conf.d/default.conf \
    &&  mkdir  -p  /var/www \
    &&  mkdir -p /var/www/html

ADD dist/ /var/www/html/
EXPOSE 8000
EXPOSE 443

jeecg-boot/ ant-design-vue-jeecg / .env.production

NODE_ENV=production
VUE_APP_API_BASE_URL=http://150.158.39.60:8080/jeecg-boot
VUE_APP_CAS_BASE_URL=http://localhost:8888/cas
VUE_APP_ONLINE_BASE_URL=http://fileview.jeecg.com/onlinePreview

2.Begin

新建任務–>構建一個自由風格的軟體專案—>原始碼管理—>點git

輸入repository URL:https://gitee.com/xiao_chaowe...(也就是倉庫地址)

配置憑證:

在這裡插入圖片描述

gitee的使用者名稱密碼

點高階:

Branch Specifier 選項:

對於單倉庫工作流輸入: origin/g i t e e S o u r c e B r a n c h

對 於 P R 工 作 流 輸 入 : p u l l / {giteeSourceBranch}

對於 PR 工作流輸入: pull/giteeSourceBranch

對於PR工作流輸入:pull/{giteePullRequestIid}/MERGE

Additional Behaviours 選項:

對於單倉庫工作流,如果你希望推送的分支構建前合併預設分支(釋出的分支),可以做以下操作:

點選 Add 下拉框

選擇 Merge before build

設定 Name of repository 為 origin

設定 Branch to merge to 為 ${ReleaseBranch} 即要合併的預設分支(釋出分支)

對於 PR 工作流,碼雲服務端已經將 PR 的原分支和目標分支作了預合併,您可以直接構建,如果目標分支不是預設分支(釋出分支),您也可以進行上訴構建前合併。

在這裡插入圖片描述

接著構建觸發器:

點選gitee webhook觸發構建

在這裡插入圖片描述
在這裡插入圖片描述

點選生成一下gitee webhook密碼 同時記錄上面一張圖的gitee webhook要填的URL。然後去gitee新增webhook進行填寫即可。

在這裡插入圖片描述

然後回來配置構建,點選增加構建步驟—>執行shell:

在這裡插入圖片描述

cd jeecg-boot
docker-compose down || true
cd ../ant-design-vue-jeecg
docker stop jeecg-boot-nginx || true
docker rm jeecg-boot-nginx || true
docker rmi nginx:jeecgboot || true
node -v
npm -v
rm -rf node_modules || true
rm -rf dist || true
npm install
npm install webpack --save-dev
rm -rf node_modules/caniuse-lite
rm -rf node_modules/browserslist
npm i --save-dev caniuse-lite browserslist
npm run build
docker build -t nginx:jeecgboot .
docker run --name jeecg-boot-nginx -p 8000:8000 --restart=always -d nginx:jeecgboot
cd ../jeecg-boot
mvn clean install
docker-compose build
docker-compose up -d

這堆命令,就是起後臺和前臺的映象,可以根據自己情況更改

然後是構建後操作:

在這裡插入圖片描述

完事了儲存一下。就可以在gitee webhook那裡點選測試,然後回到jenkins檢視控制檯輸出

在這裡插入圖片描述

然後檢視伺服器,會有四個容器已經啟動,如果啟動失敗的,看一下logs,有可能是配置之類的問題。

在這裡插入圖片描述

現在就可以訪問8000

在這裡插入圖片描述

相關文章