文章目錄

• 1. Jenkins & Gitee持續(xù)集成流程
• 2. Jenkins安裝Gitee插件
• 3. 插件配置
• 4. 安裝NodeJS
• 5. 新建構建任務
• • 5.1 General
  • 5.2 源碼管理
  • 5.3 觸發(fā)器配置
  • 5.4 構建環(huán)境
  • 5.5 構建腳本
• 6. Vue項目部署

前面介紹了一些CI/CD 持續(xù)集成的工具，如circle ci、travis ci、gitee go等，詳情可以看下系列文章：傳送門。

但是上面一些工具有的是只支持Github，有的需要收費，有的免費的只支持公開項目不支持私有項目，而且Github在國內訪問又比較慢，所以這次介紹下Gitee + Jenkins來實現(xiàn)可私有化且免費的持續(xù)集成方案。

1. Jenkins & Gitee持續(xù)集成流程

• 在本地編輯器編輯代碼，提交到gitee
• push操作觸發(fā)jenkins自動部署（jenkins安裝在docker中）
• jenkins開始構建、打包、最后部署到云服務器

2. Jenkins安裝Gitee插件

Jenkins安裝Gitee插件：

安裝完記得重啟Jenkins。

3. 插件配置

前往 Jenkins -> 系統(tǒng)管理 -> 系統(tǒng)配置 -> Gitee配置 -> Gitee 鏈接

在 鏈接名 中輸入 Gitee 或者你想要的名字

Gitee 域名 URL 中輸入Gitee完整 URL地址： https://gitee.com （Gitee私有化客戶輸入部署的域名）

證書令牌 中如還未配置Gitee APIV5 私人令牌，點擊添加 -> Jenkins

• Domain 選擇 全局憑據(jù)；
• 類型選擇 Gitee API 令牌；
• 范圍 選擇你需要的范圍；
• Gitee APIV5 私人令牌 輸入你的Gitee私人令牌，點擊獲取
• ID, 描述 中輸入你想要的 ID 和描述即可。

添加完成后，選擇這個證書令牌：

點擊【測試連接】，若出現(xiàn)成功不報錯則表示配置成功。

4. 安裝NodeJS

因為Vue項目是基于node 來打包構建的，所以要先安裝nodejs插件：

在系統(tǒng)管理 > 系統(tǒng)配置 > 全局工具配置 NodeJS安裝：

建議Node版本不要太高，選擇LTS 最新的版本即可。

5. 新建構建任務

前往 Jenkins -> 新建任務 , 輸入任務名稱 Gitee Test，選擇構建一個自由風格的軟件項目保存即可創(chuàng)建構建項目。

5.1 General

任務全局配置中需要選擇前一步中的Gitee鏈接。前往某個任務（如’Gitee Test’）的 Configure -> General，Gitee 鏈接 中選擇前面所配置的Gitee鏈接，如圖：

5.2 源碼管理

• 選擇 Git選項，輸入你的倉庫地址
• 憑據(jù)Credentials中請輸入 git 倉庫https 地址對應的 用戶名密碼憑據(jù)，或者 ssh 對應的 ssh key 憑據(jù)，注意 Gitee API Token 憑據(jù)不可用于源碼管理的憑據(jù)，只用于gitee插件的 API 調用憑據(jù)（這里再添加一個用戶名密碼的憑據(jù)就行啦）。
• 點擊【高級】 Advanced 按鈕, Name 字段中輸入 origin， Refspec 字段輸入 +refs/heads/*:refs/remotes/origin/* +refs/pull/*/MERGE:refs/pull/*/MERGE
  ，注意新版jenkins不再接受多條同時包含*通配符的refs描述，如只對push觸發(fā)可寫前半部分，如只對PR觸發(fā)可只寫后半段。（這里我就先寫前半部分）
• 指定分支：master
  

5.3 觸發(fā)器配置

這里我是配置push代碼立即觸發(fā)構建任務：

勾選Gitee webhook 觸發(fā)構建，后面有個地址這個后面需要配置到Gitee，Gitee觸發(fā)構建策略勾選推送代碼，其他先默認就行，后面有個Gitee WebHook密碼欄位需要配置到Gitee，點擊生成就會生成一個密碼；

打開Gitee這個項目的管理，左側有個WebHooks ，點擊【添加webHook】:

將上一步Jenkins生成的URL和密碼填進去，點擊【添加】：

5.4 構建環(huán)境

修改構建任務的構建環(huán)境，勾選Provide Node & npm bin/ folder to PATH，默認會選擇剛才選擇的nodeJS:

5.5 構建腳本

選擇【執(zhí)行shell】：

先隨便寫一個shell腳本試試水吧：

保存后，我們提交一次看看，很快就構建成功了：

6. Vue項目部署

vue項目通過node 構建后，需要將構建后的dist文件夾的內容部署到云服務器，因為jenkins是docker容器創(chuàng)建的，容器內部不能直接移動文件，因為沒有掛載，所以這里可以使用SSH登錄的方式登錄到遠程主機再來使用docker命令來移動容器的文件到宿主機的nginx服務器。先來安裝下Publish over SSH，進入插件管理：

安裝完成后，在系統(tǒng)管理->系統(tǒng)配置 會多出一個Publish over SSH。

先在宿主機生成SSH key（若已經(jīng)有了SSH Key可以直接使用）:

ssh-keygen -t rsa -C "xxxx@qq.com"

# 將公鑰放到authorized_keys，否則SSH Server配置會不成功 cat id_rsa.pub >> authorized_keys

在系統(tǒng)管理 > 系統(tǒng)配置 中配置 Publish over SSH , 配置Jenkins SSH Key：

點擊 Test Configuration按鈕，左側顯示 Success 即表示SSH可以連接成功：

Jenkins 會通過 Git 下載項目，會下載到/var/jenkins_home/workspace/目錄，Jenkins 鏡像通過 ssh 登陸到宿主機時，可以直接訪問到鏡像中的該目錄，所以能在宿主機執(zhí)行該命令。

其他步驟同上，構建步驟修改腳本：

先添加一個Transfer Set 刪除部署目錄的文件：

再加一個 Transfer Set 傳送文件到部署目錄：

部署效果：

注意點：

1.若jenkins不是用docker容器安裝的，可以直接用cp命令復制將jenkins打包的文件復制到nginx對應的目錄，不用SSH 來傳輸文件。


2.node版本記得改成和本地相同的，曾經(jīng)在安裝vue-element-admin時遇到install失敗的問題就是node版本太高了。


3.vue-element-admin 我去除了tui-editor，因為從git下載總是報錯（可以通過加hosts來解決）

總結

以上是生活随笔為你收集整理的Jenkins Gitee 实现持续集成CI/CD工具【免费、推荐】的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內容還不錯，歡迎將生活随笔推薦給好友。