Jenkins 集成多分支Taro微信小程序

github地址

Jenkins 集成多分支Taro微信小程序

微信開發者工具中雖然集成了預覽、上傳功能，可是在微信小程序的管理後臺，每一個開發者上傳的版本都是獨立的。

若是是多人協做開發，其中一個開發者在修復了 BUG，或者新增了功能，想要上傳體驗版給測試時，還要登錄後臺從新設置體驗版，而後再把體驗版的二維碼發給測試。
每次都要這麼操做一番，效率又低，還打斷開發者的思路。

萬一你請假了，同事幫你改點東西，有可能還沒辦法上傳，還得在你的休息日奪命連環 call 你。更是體驗極差。

因此咱們採用 Jenkins 持續部署的方式來自動部署上傳小程序，免去人工的煩惱。

你們能夠看一看大佬已經部署成功的文章 微信小程序集成 Jenkins

因爲需求跟上面大佬的不太同樣，咱們公司使用的是 Taro 框架來開發小程序，而且同一個項目下有多個分支都須要進行發佈部署。所以也須要進行一些修改。

Taro是京東旗下凹凸實驗室推出的一款使用React語法進行多端統一開發的解決方案。

支持微信小程序、H五、百度小程序、支付寶小程序、快應用、ReactNative、字節跳動小程序、QQ 輕應用。能夠說是目前小程序開發框架中支持最齊全的了。

下面咱們就來說解如何在Jenkins裏集成多分支Taro小程序項目

在集成部署中須要微信開發者工具，目前微信開發者工具只有 macOS 和 Windows 兩種版本,上文的大佬用的是 macOS 系統，本文采用 Windows 系統進行部署，使用的是PowerShell，但願能對 Windows 系統的小夥伴們提供一些幫助。

下面講解下具體步驟

安裝 Jenkins

這個步驟和上文大佬的文章是同樣的

Jenkins 依賴 java1.8，須要首先在咱們的服務器上安裝 java1.8 版本。以後 直接下載最新的穩定 Jenkins WAR 包，
而後以管理員身份運行 PowerShell，並執行如下命令啓動 Jenkins

java -jar Jenkins.war --httpPort=8888

其中，--httpPort=8888 爲設置服務端口號，默認端口號爲 8080 。

注意執行時 PowerShell 所在的文件夾地址要對

新建多分支流水線任務

這裏與上面大佬的文章就有區別了。
爲了讓每一個分支均可以有本身的部署策略，因此咱們選擇使用多分支流水線任務的方式來部署任務

配置任務

一、配置源碼及分支

咱們在Branch Sources中選擇git源。填入倉庫地址，選擇適合你的驗證方式。

在Behaviours中，咱們能夠經過新增Filter by name的配置項來篩選分支，例如咱們如今只但願自動部署以dev開頭的分支，那麼就填寫dev*。

二、配置觸發器

如圖所示，咱們使用Jenkinsfile來配置流水線。

觸發器間隔選擇1分鐘。至關於每隔一分鐘Jenkins會查看一下你的git倉庫中有沒有更新。若是有更新就會觸發自動部署流程。你能夠選擇合適你的觸發間隔。

如今咱們的Jenkins任務配置就已經完成了，點擊保存按鈕便可。

編寫Jenkinsfile

Jenkinsfile是Jenkins流水線任務的聲明方法之一，具體能夠你們能夠查看Jenkinsfile介紹

首先咱們在git項目的根目錄下建立一個Jenkinsfile文件
若是想建立在其餘位置，那麼須要調整上面配置觸發器部分的 腳本路徑 選項

// Jenkinsfile內容
pipeline {
    agent any
    options{
        retry(3)
        timeout(time:10, unit: 'MINUTES')
    }
    stages {
       stage('start') {
          steps {
            echo '構建開始...'
          }
        }
       stage('build') {
          //  在這裏也能夠設置一些條件，例如分支名稱過濾等
          when { branch 'dev*' }
          steps {
            // Windows下使用bat啓動腳本，linux或manOS下使用sh啓動腳本
            bat 'powershell ./deploy.ps1'
          }
        }
    }
   post {
       success {
            echo '構建成功'
          }
       failure {
            echo '構建失敗'
          }
    }
}

編寫部署腳本

上面的Jenkinsfile中咱們能夠看到，在build階段咱們啓動了一個名字叫作deploy.ps1的PowerShell腳本。咱們的部署、編譯、上傳等步驟都放在腳本中進行。

在咱們實際應用中開發們能夠直接使用開發者工具進行預覽，測試們使用體驗版進行測試，因此不須要預覽二維碼，若是須要預覽二維碼請參考上文大佬的文章。

首先確認服務器中已經安裝了nodejs、微信開發者工具
微信開發者工具必須是已經登錄的狀態。最好能夠申請一個自動構建專用的微信帳號。
在微信開發者工具的安全設置中開啓服務端口
Taro的cli須要在項目本地安裝

微信小程序在上傳時能夠填寫版本號，版本號也能夠有效的幫助咱們區分當前體驗版的版本，所以咱們在根目錄下新建一個 version 文件，將版本號寫進去，腳本會自動讀取版本號並上傳

1.0.0

項目根目錄下新增 deploy.ps1 文件

# deploy腳本代碼
Write-Output "下載npm包"
npm i --registry=http://registry.npm.taobao.org
Write-Output "開始編譯"
# 這裏使用的是開發模式編譯，若是須要生產模式，將末尾的 --env development 去掉就能夠了
.\node_modules\.bin\taro build --type weapp --env development
Write-Output "讀取版本和編譯地址"
$version = Get-Content ./version
Write-Output $version
Write-Output "上傳代碼"
$path = (Get-Location).Path + "\dist"
$p1 = $version + "@" + $path
Write-Output $path
Write-Output $p1
# 須要修改成你本身的微信web開發者工具安裝目錄
& 'C:\Program Files (x86)\Tencent\微信web開發者工具\cli' -o $path
Start-Sleep -Seconds 10
& 'C:\Program Files (x86)\Tencent\微信web開發者工具\cli' -u $p1 --upload-desc '自動構建'
Write-Output "關閉當前項目"
& 'C:\Program Files (x86)\Tencent\微信web開發者工具\cli' --close $path
& 'C:\Program Files (x86)\Tencent\微信web開發者工具\cli' --quit

在這裏我遇到了一個微信開發者工具的BUG，因爲是多分支模式，每一個分支必然會長的比較像。也可能存在某些頁面或文件在分支A中存在，分支B中不存在。這時候假如分支A上傳成功，咱們又觸發了分支B的自動部署，命令行模式下的微信開發者工具會報錯說找不到分支A的某些文件。GUI手動模式下則沒有問題。解決辦法是將微信開發者工具徹底關閉再從新打開。

設置Jenkins開機自啓動

Windows10的自動更新已經飽受詬病多時了。Windows10強制要求每35天系統至少更新並重啓一遍，每次重啓咱們還須要手動開啓Jenkins也是一件很麻煩的事。所以咱們給它配置一個開機自啓動。

首先建立一個Jenkins的啓動腳本 JenkinsAutoStar.ps1

java -jar "D:\Java\Jenkins.war" --httpPort=8888

一、打開計劃任務，建立一個新的基本任務

二、在觸發器中選擇 計算機啓動時

三、在操做中選擇 啓動程序

四、填寫啓動程序配置

程序或腳本中填寫
C:\Windows\System32\WindowsPowerShell\v1.0\powershell.exe
添加參數中填寫
C:\Users\your PC\Desktop\JenkinsAutoStar.ps1

五、勾選 單擊萬成時打開此任務屬性對話框 並點擊完成

六、配置權限

用戶帳戶使用 Administrator
勾選 使用最高權限運行
點擊肯定

如今咱們已經成功部署了Jenkins的開機啓動

以上就是Jenkins集成多分支Taro小程序的所有內容，做者水平有限，若有不清楚的地方或者錯誤歡迎你們批評指正～