01【前端工程化初探】基於Jenkines+GitLab+Tomcat的可持續化集成環境

寫在前面

閒着無聊的時候，跟昊哥在羣裏吹筆，發現這位大佬自己搭建了一套後臺Java環境，名字叫"可持續化集成環境"，聽起來很高大上，所以自己也想折騰一套屬於前端的"可持續化集成環境"。可持續化的這個名字初聽是那麼的高大上，但是部署完之後回過頭來再看整個流程，其實說白了就是下面這樣一個流程：

• 我們在自己的電腦上開發應用系統，然後將代碼提交至gitlab或者github；
• 當代碼提交至gitlab或者github之後，會觸發一個webhooks，然後這個狀態就會傳到Jenkines這套環境中；
• Jenkines這套環境就是可持續化集成的核心，它會將我們上傳到git的項目代碼進行打包構建，然後部署到我們的應用服務器上；
• 以上就是一個基礎的可持續化集成流程。

看到這，你覺得這玩意其實也就那樣，但是忘記告訴你了，這一套流程中除了將本地開發的代碼提交至gitlab或者github這個動作是我們要手動做的之外，其餘的所有過程都是自動完成的，包括打包和部署。這樣子告訴你，你是否會感興趣一點呢。我們接下來繼續~

 

爲什麼要做這件事情

不管接下來我說的理由多麼的有說服力，但是核心理由只有一點：我就是想折騰，想裝筆~

好了，接下來說點比較正經的理由吧：

我們平時開發一個項目，研發流程可能是這樣的：

1. 本地機器上寫代碼
2. 在命令行輸入 npm run unit，查看單元測試結果
3. 提交代碼，push 到 git 遠程倉庫
4. 登錄測試服務器，拉取代碼，執行 npm run build，構建項目
5. 如果測試服務器是基於 pm2 的 proxy server，還需要重啓 server

這個過程太多的人工干預，有時候小手一抖可能就在哪個過程出問題了。所以大量浪費了我們寶貴的時間和精力。

但有了CI/CD環境之後，這一切似乎發生了點變化：

1. 本地機器上寫代碼
2. 提交代碼，push 到 git 遠程倉庫
3. git hook 觸發 jenkins 的構建 job （自動）
4. jenkins job 中拉取項目代碼，運行 npm run unit 和 npm run build，如果失敗，發送郵件通知相關人。（自動）
5. jenkins job 中執行測試服務器的部署腳本 （自動）

上述整個過程，只有在第一步和第二步是手動進行的，其餘都是自動進行，大量減少了人工干預和重複性操作，是一個非常標準化的流程。

好了，以上就是我花三天時間來搞這套環境的理由。

 

怎麼做呢

服務器規劃：

其實吧，規劃啥服務器啊，本人窮筆一個，哪有那麼多服務器去折騰，只有在本機開虛擬機來折騰了，下面就說說虛擬機的規劃吧：

• 第一臺虛擬機(192.168.0.104)，安裝部署GitLab環境
• 第二臺虛擬機(192.168.0.107)，安裝部署Jenkines環境
• 第三臺虛擬機(192.168.0.111)，裝了一個tomcat，主要用來存放構建部署後的項目代碼
• 以上三臺服務器都是CentOS 8.1環境，4G內存，50G硬盤空間，靜態ip

具體怎麼做呢：

請看【前端工程化初探】這個系列接下來的三篇文章吧~