圖解 Jenkins Pipeline 的前端自動化部署，用上后真香！
一、Jenkins 前端部署思路
1.1 整體架構圖
圖片
1.2 部署步驟
圖片
二、Pipeline和自由風格對比
Jenkins是一個開源的自動化服務器，它可以幫助自動化各種任務，包括構建、測試和部署軟件。
上次我們講解了如何通過 Jenkins 的自由風格的軟件項目來配置前端的自動化部署，如下圖所示，如何選擇自由風格的軟件項目。優點就是簡單！
圖片
這次我們將講解如何通過流水線（Pipeline）方式來部署前端項目。優點就是更加靈活！如下圖所示，就是選擇 Pipeline 方式。
圖片
在Jenkins中，有兩種主要類型的任務：Pipeline任務和自由風格項目（Freestyle project）。
- Pipeline任務：
Pipeline任務是Jenkins 2.0引入的一個新特性，它使用Jenkinsfile來定義整個構建流程。
Jenkinsfile是一個文本文件，使用Groovy語言的DSL（領域特定語言），可以定義構建的各個階段和步驟。
Pipeline任務支持復雜的構建流程，包括多個階段和步驟，以及并行執行等高級功能。
Pipeline任務可以很容易地與源代碼管理系統集成，支持持續集成（CI）和持續交付（CD）。
- 自由風格項目：
自由風格項目是Jenkins早期版本中的主要任務類型，允許用戶通過Jenkins的Web界面配置構建步驟。
這種類型的項目沒有固定的構建流程定義方式，用戶可以手動添加構建步驟、配置插件和參數等。
自由風格項目適合快速設置簡單的構建任務，但對于復雜的構建流程，可能不如Pipeline任務靈活和強大。
兩者的主要區別包括：
定義方式：Pipeline任務通過Jenkinsfile定義，而自由風格項目通過Jenkins的Web界面配置。
靈活性和擴展性：Pipeline任務更加靈活，支持復雜的構建流程和高級功能，如并行執行和模板化。
集成度：Pipeline任務更容易與源代碼管理系統集成，實現自動化的CI/CD流程。
學習和使用難度：Pipeline任務可能需要用戶學習Jenkinsfile的語法和DSL，而自由風格項目則更直觀，易于上手。
提示：Pipeline 任務代表了Jenkins的未來方向，提供了更高級的自動化構建能力，而自由風格項目則適合快速設置簡單的構建任務。隨著Jenkins的發展，越來越多的用戶和組織傾向于使用Pipeline任務來實現更高效的自動化流程。
三、Pipeline 核心腳本
3.1 獲取 Git 代碼分支
3.1.1 Git 分支插件
用了一個插件 gitParameter，可以獲取 git 倉庫的分支，部署的時候，可以選擇分支。如下圖所示，Git 倉庫有 develop 和 master 分支，默認選中 develop 分支。
圖片
圖片
3.1.2 Git 環境變量
圖片
3.1.3 獲取 Git 分支代碼
圖片
這個步驟中有一一行關鍵的代碼，可以通過 Git 插件獲取選擇的 Git 分支。
圖片
3.2 拷貝依賴包
因為 node_modules 不會上傳到 git 倉庫，所以我們需要提前準備好。
而我們項目我是先在有網的 Linux 服務器上用 npm install 命令下載的依賴包，然后手動壓縮拷貝到 jenkins 服務器的 passjava 目錄。
當執行部署的時候，會從 passjava 目錄將 node_modules 壓縮包拷貝并解壓到 jenkins 的當前工作目錄。
圖片
3.3 編譯代碼
編譯前端代碼可以用 npm run build xx 命令，然后將編譯后的 dist 目錄壓縮。
圖片
3.4 備份代碼
將 web 服務器上多個前端項目移動到備份目錄 web-bak 。
圖片
3.5 上傳代碼
將編譯后的代碼包上傳到 web 服務器。
圖片
3.6 更新代碼
將 dist 壓縮包解壓，然后將多個前端工程拷貝到 web 目錄。如 passjavabase, passjava-channel, project-contract 目錄拷貝到 passjava-web-micro 目錄。
圖片
3.7 清理代碼
清理 web 服務器上備份的代碼。
以下命令是查找并刪除指定路徑下超過7天未修改的目錄。
圖片
這條命令會找到 /nfs-data/passjava/web-bak/ 目錄下所有超過7天未修改的子目錄，并將其打印出來，然后刪除這些目錄。
- 查找超過7天未修改的目錄：
-mindepth 1：確保查找從指定目錄的子目錄開始，不包括指定的根目錄。
-maxdepth 1：限制查找僅在指定目錄的第一層子目錄中進行。
-type d：只考慮目錄，不包括文件。“-type -f” 只考慮文件，不包括目錄。
-mtime +7：篩選出修改時間超過7天的目錄。
-print：打印出這些目錄的路徑。
- 刪除找到的目錄：
-exec rm -rf {} +：對找到的每個目錄執行 rm -rf 命令，遞歸且強制刪除該目錄及其內容。
該步驟的完整代碼如下：
圖片
3.8 郵件通知
詳見筆者之前寫的一篇：持續集成：Jenkins Pipeline 郵件通知
四、總結
通過使用 Jenkins Pipeline 進行前端自動化部署，團隊可以更加高效地管理和部署前端應用程序，減少人為錯誤和手動操作帶來的風險，提升整體的開發和部署效率。
本文通過圖解+代碼的方式講解了前端自動化部署的步驟，文中的腳本針對前端的三個模塊進行打包，比較耗時，所以后續可以優化的地方是支持選擇部署前端的不同模塊。
