在 Jenkins 上實現 webpack 打包

Jenkins是什麼？

Jenkins 是 開源的 、提供友好操做界面的 持續集成( CI ) 工具，集成了 Git 插件，起源於 Hudson。主要用於持續、自動的構建項目。

一句話理解 Jenkins

Jenkins 能夠爲咱們 自動拉取  github 上代碼，幫咱們 編譯 、 打包 、 執行 、 部署 的自動化工具。

知識點 GET

CD、CI概念

CI概念：

持續集成(Continuous integration)是一種軟件開發實踐，即團隊開發成員常常集成它們的工做，經過每一個成員天天至少集成一次，也就意味着天天可能會發生屢次集成。每次集成都經過自動化的構建（包括編譯，發佈，自動化測試）來驗證，從而儘早地發現集成錯誤

CD概念：

持續部署（continuous deployment）是經過自動化的構建、測試和部署循環來快速交付高質量的產品。

pipeline（流水線） 概念

Jenkins 從根本上來說是一種支持多種自動化模式的自動化引擎。
那麼pipeline 是在Jenkins 上添加了一套強大的自動化工具，支持 從簡單的鏈接集成到全面的連續輸送pipeline  的用例。能夠基於它實現更爲負載的建模場景。
pipeline 目前支持 Java / Node.js / Javascript / Ruby / Python / PHP

如何實現 webpack 打包

1. 編輯 Jenkins Job 配置項

2. 找到 pipeline 配置，選擇 Pipeline script 後寫入腳本

node {
    def folderName = "${projectName}-${version}"
    sh "rm -rf ${folderName}"
    sh "mkdir -p ${folderName}"

    stage('Project get Code ') {
        dir("${folderName}")
        {
            checkout scm
        }

        echo "拉取代碼成功"
    }

    stage('Main Project Build') {
        
        dir("${folderName}")
        {
            sh "sed -i 's/{version}/${version}/g' package.json"
            sh "cp ${projectName}/mainProjectBuild.sh ./"
            sh "sed -i 's/{version}/${version}/g' mainProjectBuild.sh"
            sh "sh mainProjectBuild.sh"
			
            echo "編譯 & 打包完成"
        }
    }
  
    stage('Results') {
        echo "發佈成功"
    }
}
複製代碼

pipeline 語法 注意

• Scripted Pipeline從頂部順序執行
• node {} 最外層必須是node節點，聲明工做空間
• def folderName = "${projectName}-${version}"  聲明局部變量
• sh "rm -rf ${folderName}"  經過shell命令，執行 rm -rf xx 。只有在命令返回零退出代碼時纔會繼續，任何非零退出代碼整個Pipeline將斷定爲部署失敗。
• ${folderName} 變量能夠經過這樣相似shell的方式獲取。
• stage('Project get Code '){} stage是一個階段的語法，括號中是階段名稱。腳本從node開始，按順序向下執行。遇到一個stage就是一個階段。
• dir("xx") 更換執行目錄。
• checkout scm 是Jenkins 固定獲取代碼的方法，會輸出Check out from version control
• echo "拉取代碼成功" 輸出文字，給出當前進度信息

附 mainProjectBuild.sh

npm install
npm run build
zip -r {version}.zip dist
複製代碼