使用Jenkins實現前端自動化釋出和通知，讓你的釋出只需要git push

以前我們在釋出專案時都要手動進行打包，然後使用FTP或者其他方式同步到伺服器上，這種方式非常繁瑣和低效，而且容易出現環境釋出錯誤，為了解決這些問題我們可以使用jenkins來進行自動化釋出。

我使用的系統是CentOS 7.5，在安裝環境的時候其他系統會有區別。

jenkins釋出工作流程

• 本地push程式碼
• 服務端jenkins拉取程式碼
• 將程式碼移到web服務工作目錄
• 傳送郵件通知

準備

• git倉庫（可以是gitlab，github，碼雲或者其他帶web hooks的git倉庫）
• 伺服器一臺（windows或者Linux都可以，本文使用的是CentOS 7.5 64位）
• 伺服器安裝git，java，jenkins

安裝java

yum install java
複製程式碼

驗證是否安裝成功

java -version
複製程式碼

如果有版本號輸出表示安裝成功

安裝git

yum install git
複製程式碼

驗證是否安裝成功

git --version
複製程式碼

安裝jenkins

提示：作業系統不一樣下載的包也不一樣，安裝命令也不一樣

• 開啟jenkins.io/zh/download…，選擇對應系統的安裝檔案

• 安裝 (安裝包目錄下執行)

  sudo rpm -ih jenkins-2.121.3-1.1.noarch.rpm

• 啟動

  service jenkins start

如果啟動成功，我們在瀏覽器輸入http://伺服器地址:8080就能訪問到入門頁面了，如果不能訪問檢查8080埠是否被佔用。

在伺服器上輸入cat /var/lib/jenkins/secrets/initialAdminPassword檢視管理員密碼，輸入密碼後點選繼續。

然後選擇安裝推薦的外掛等待安裝完成

安裝完成後我們點選右下角使用admin賬號繼續

然後點選儲存並完成

點選開始使用 jenkins就會跳轉到首頁

建立任務

點選開始建立一個新任務，輸入名稱，選擇構建一個自由風格的軟體專案，然後點選確定

配置原始碼管理

• 點選原始碼管理
• 選擇GIT
• Repository URL填寫我們git倉庫地址

• Branches to build輸入我們需要拉取的分支

構建配置

git拉取完成後，我們需要將程式碼複製到web服務的目錄下，這裡我們可以使用sshell命令來進行操作

• 點選構建
• 點選增加構建步驟，選擇執行sshell

• 輸入複製檔案命令 cp -r ./dist/* /var/project/test (注意路徑和資料夾名稱，需要改成你專案的路徑)

然後點選儲存，現在我們可以點選左邊選單中的立即構建來發布專案。

web hooks 自動釋出

到此我們構建就配置好了，但是還是需要我們提交程式碼後開啟jenkins點選構建，接下來我們實現git push程式碼之後自動進行構建

安裝Generic Webhook Trigger外掛

• 回到首頁，點選系統管理 -> 外掛管理

• 點選可選外掛，搜尋Generic Webhook Trigger，然後點選直接安裝

• 安裝完成後返回首頁，點選專案名稱，選擇配置

• 點選構建觸發器，選擇Generic Webhook Trigger

• 在Token處填寫一個token （不能與其他專案token重複），然後點選儲存

git配置hooks（github新增方法類似，在設定中新增）

• 開啟git專案頁面，選擇配置 -> WebHook -> 新增

• 在URL處填寫地址你的jenkins伺服器地址:埠/generic-webhook-trigger/invoke?配置的token，例如我的地址就是http://192.168.3.18:8080/generic-webhook-trigger/invoke?token=test-project
• 點選儲存，後續只要push程式碼，jenkins便會自動釋出

郵件提醒

構建完成後將結果和log傳送到郵箱，以qq郵箱為例，其他郵箱類似

• 在jenkins外掛中搜尋Email Extension Plugin安裝 （如果搜尋不到就去以安裝裡面搜尋下是否已經安裝了）
• 安裝完成後，回到首頁，點選系統管理 -> 系統配置

• 系統管理員郵件地址：填寫配置的郵箱地址

• 找到Extended E-mail Notification選項，填寫以下配置

  • SMTP server：郵箱的SMTP地址，qq郵箱是smtp.qq.com 163郵箱是 smtp.163.com，其他郵箱可以自行查詢
  • Default user E-mail suffix：郵箱字尾
  • 點選右下角高階，填寫下圖配置

  

  

  配置中User Name為你的郵箱，Password為你的smtp密碼，可以去郵箱設定中檢視

  

  • Default Content Type：選擇HTML(text/html)
  • Default Recipients：填寫預設收件人

• 配置完成後返回專案設定，選擇構建後操作，點選增加構建後操作步驟，選擇Editable Email Notification

• Project Recipient List選項填寫你通知的郵箱

• Attach Build Log選擇Attach Build Log，傳送郵件的時候附帶構建日誌

• 點選Add Trigger選擇Always然後點選儲存

  

  

• 配置完成後點選儲存，然後點選立即構建就可以測試我們的郵件通知是否能傳送成功

結尾

到此我們就完成了jenkins的自動化釋出，但是這還只是簡單的配置，後續我還會繼續寫如何釋出到遠端伺服器，正是環境和測試環境區分, node和golang的構建釋出。

ps: flutter-weui是使用flutter實現的一個weui元件庫，支援安卓，ios（web和桌面也可以）現在已經實現了將近30多個元件，喜歡的賞賜個Star✨✨