Jenkins配合github實現前端項目自動化構建部署

前言

你們之前寫前端項目部署，可能都是手動運行命令，打包完，而後壓縮，再利用FTP、Xshell等這類的工具上傳到服務器解壓。也或者你不會操做，你認爲這些事情是運維作的，你只須要打包你的前端項目代碼後發給運維你就無論了。這種方式確實有點low且效率也不高。

如今你們更關注的是Devops，關注如何來作持續集成，持續交付，如何來作CI/CD。

今天就拿Jenkins配合Github實現自動化集成打包部署。

系列文章：

CentOS 7 安裝 JAVA環境（JDK 1.8）

CentOS 7 安裝Node

Jenkins的安裝這裏就不在說明了，網上安裝教程不少。

Jenkins介紹

引用百度百科的一句話：Jenkins是一個開源軟件項目，是基於Java開發的一種持續集成工具，用於監控持續重複的工做，旨在提供一個開放易用的軟件平臺，使軟件的持續集成變成可能。

在工做中部署jenkins的最大好處就是每次在開發、測試環境代碼，都無須運維部署，而是相關的開發人員，測試人員登陸jenkins構建須要部署的tag或者分支便可，整個部署過程無須運維參與，解放運維勞動力。

也不用擔憂部署在多個服務器，在家寫代碼也不用遠程公司部署項目，提交代碼後會自動爲你部署。

部署方式

jenkins的構建方式經常使用分爲三種。

jenkins觸發式構建：push代碼或者合併代碼到項目的master或者其餘分支，jenkins就部署代碼到對應服務器。

jenkins參數化構建：push代碼或者合併代碼到項目的master或者其餘分支以後，並不會部署代碼，而是須要登陸到jenkins的web界面，點擊構建按鈕，傳入對應的參數（好比參數須要構建的tag，須要部署的分支）而後纔會部署。

jenkins定時構建：多用於APP、自動化用例等自動打包，定時構建是在參數化構建的基礎上添加的，開發人員能夠登陸jenkins手動傳入tag進行打包，若是不手動打包，那麼jenkins就定時從配置項目地址拉取最新的代碼打包。

Jenkins + github持續集成

建立 github AccessToken

進入github 設置頁，選擇Developer settings

選擇 Personal access tokens -> Generate new token

勾選以下配置

而後點生成就好了，切記必定要保存好這個token，只顯示一次。

配置Jenkins

進入系統管理 => 管理插件 => 安裝插件 Github Plugin

而後進入 系統管理 => 系統設置 => Github Server 添加信息

Credentials 那裏再點擊 Add 添加以下信息

添加完畢以後記得選擇咱們剛剛添加的信息

最後點擊 Test Connection 若是配置正確應當有以下顯示：

建立任務

建立一個自由風格的任務

勾選 Github Project 填入github倉庫url

源碼管理選擇Git ，填寫倉庫git地址，選擇須要構建的分支，我這裏選擇master （** 爲選擇全部分支）

構建觸發器，這裏大家能夠根據上面所說的部署方式來選擇，這裏我選擇 GitHub hook trigger for GITScm polling ，來完成 push 後自動構建

而後就是構建 => 增長構建步驟 => 執行shell 填入你本身的構建和部署的命令 我這裏拿個人hexo博客舉例

如今若是提交代碼到對應的分支，就會自動觸發構建，若是構建成功，也就自動部署在你的網站上了。其實這裏就是我們配置生效了，github監聽到我們push後，利用webhook通知Jenkins：大爺來玩呀，Jenkins就會根據我們的配置自動完成構建部署。

總結

配置看似很繁瑣，其實很簡單，配置過一次，再配置第二次就是手到擒來，其餘項目也是如此，如 vue + webpack類的，只是構建的shell命令不同而已。還有，切記 rm -rf慎用慎用！233... o(╥﹏╥)o