前言

在開(kāi)發(fā) UniApp H5 項(xiàng)目時(shí)，隨著版本迭代，我們需要不斷發(fā)布測(cè)試版本到線上給測(cè)試人員使用；雖然 HBuilderX 點(diǎn)兩下就可以打包，但是打包、壓縮、再上傳還是稍顯繁瑣。好在 HBuilderX 提供了 CLI 工具，結(jié)合 CLI 和其他腳本工具我們可以做到一鍵打包、發(fā)布、并上傳部署。

HBuilderX 僅適配了 Windows 和 macOS 平臺(tái)，本文只研究 Windows 平臺(tái)如何實(shí)現(xiàn)自動(dòng)化，使用 macOS 平臺(tái)的朋友對(duì)照著 PowerShell   腳本內(nèi)容，將腳本內(nèi)容替換成適配 ZSH 的 Shell 腳本即可。

思路

實(shí)現(xiàn)思路比較簡(jiǎn)單，大體步驟如下：

1. 使用 HBuilderX 提供的 CLI 工具打包 UniApp 項(xiàng)目

2. 將打包產(chǎn)物壓縮成 zip 文件

3. 彈出文件瀏覽器并選中高亮 zip 文件

4. 一鍵上傳至測(cè)試服務(wù)器

腳本內(nèi)容

這一段比較簡(jiǎn)單，配置 CLI 路徑之后讀取當(dāng)前項(xiàng)目目錄，以當(dāng)前目錄路徑作為項(xiàng)目路徑來(lái)進(jìn)行打包，這意味著我們運(yùn)行此腳本時(shí)需要在項(xiàng)目根目錄來(lái)運(yùn)行。

使用時(shí)請(qǐng)自行替換 CLI 路徑為 HBuilderX 安裝路徑，CLI 路徑以及更多用法參見(jiàn)： https://hx.dcloud.net.cn/cli/publish-h5

$cli = "C:\Users\admin\Documents\tools\HBuilderX\cli.exe"
$projectPath = (Get-Location).Path

$parameters = @("publish", "--platform", "h5", "--project", $projectPath)
&$cli @parameters

將打包產(chǎn)物壓縮成 ZIP 文件，并使用當(dāng)前日期，結(jié)合摘要算法生成隨機(jī)文件名。

$dateTime = Get-Date -Format "yyyy_MM_dd"
$fileName = $dateTime + ".zip"
Write-Host "正在壓縮..."
Compress-Archive -Path .\unpackage\dist\build\web\* -DestinationPath $fileName -Force
$hash = (Get-FileHash -Algorithm SHA256 $fileName).Hash.Substring(0, 8)
$newFileName = "dist_$($dateTime)_$hash.zip"
Rename-Item -Path $fileName -NewName $newFileName
$fileName = $newFileName
Write-Host "壓縮完成!"

可以使用如下命令打開(kāi)文件管理器并高亮對(duì)應(yīng)的 zip 文件：

Invoke-Expression "explorer '/select,.\$fileName'"

如果需要自動(dòng)部署至 Linux 服務(wù)器上，需要配置免密登錄，大家可以參考這篇文章來(lái)實(shí)現(xiàn)： https://www.cnblogs.com/caibaotimes/p/14194044.html

自動(dòng)部署具有一定的風(fēng)險(xiǎn)性，請(qǐng)使用時(shí)務(wù)必謹(jǐn)慎，確保理解了腳本的每一行含義之后再使用，本人對(duì)該腳本帶來(lái)的一切后果概不負(fù)責(zé)。

自動(dòng)部署

自動(dòng)部署至 Linux 服務(wù)器的思路如下：

1. 上傳 zip 文件至服務(wù)器

2. 備份原有資源文件

3. 解壓 zip 文件到項(xiàng)目對(duì)應(yīng)路徑

remoteServer 是 SSH 相關(guān)配置，將 root 替換為相應(yīng)用戶(hù)名， t.tt 替換為服務(wù)器對(duì)應(yīng)域名。

另外 shellScript 腳本也需要另行修改，例如前端項(xiàng)目路徑為 /opt/project/web，則將腳本第一行中 cd 之后緊跟的項(xiàng)目根路徑 /www/wwwroot/t.tt/public 替換為 /opt/project， 腳本中存在的其他 work 目錄替換為 web 目錄 。

$remoteServer = "[email protected]"
$shellScript = @'
cd /www/wwwroot/t.tt/public
rm -rf work_backup
mv work work_backup
unzip -q /tmp/{FILENAME} -d work/
'@
$shellScript = $shellScript.Replace("`r", "").Replace("{FILENAME}", $fileName)

Write-Host "正在上傳..."
scp $fileName "$($remoteServer):/tmp/$($fileName)"
Write-Host "上傳成功!"
ssh $remoteServer $shellScript
Write-Host "部署成功!"

配置 PowerShell

編寫(xiě)完腳本后，還需要將該腳本封裝為函數(shù)，并寫(xiě)進(jìn) PowerShell 的配置文件中，這樣我們才能在終端中隨時(shí)調(diào)用該打包命令。

PowerShell 的配置文件位于 C:\Users\{用戶(hù)名}\Documents\PowerShell\Microsoft.PowerShell_profile.ps1，如果該文件不存在，請(qǐng)自行創(chuàng)建。

在文件中新建一個(gè)名為 buildUNI 的函數(shù)，配置相關(guān)內(nèi)容之后關(guān)閉該配置文件；新開(kāi)啟一個(gè)終端窗口，切換到 UniApp 項(xiàng)目根目錄，輸入剛才新建的函數(shù)內(nèi)容，即可開(kāi)始愉快的打包啦~

以下是完整腳本，Enjoy~

function buildUNI {
	# 打包H5平臺(tái)文件
	$cli = "C:\Users\admin\Documents\tools\HBuilderX\cli.exe"
	$projectPath = (Get-Location).Path
	$parameters = @("publish", "--platform", "h5", "--project", $projectPath)
	&$cli @parameters
	
	# 壓縮成zip文件
	$dateTime = Get-Date -Format "yyyy_MM_dd"
	$fileName = $dateTime + ".zip"
	Write-Host "正在壓縮..."
	Compress-Archive -Path .\unpackage\dist\build\web\* -DestinationPath $fileName -Force
	$hash = (Get-FileHash -Algorithm SHA256 $fileName).Hash.Substring(0, 8)
	$newFileName = "dist_$($dateTime)_$hash.zip"
	Rename-Item -Path $fileName -NewName $newFileName
	$fileName = $newFileName
	Write-Host "壓縮完成!"

	# 打開(kāi)對(duì)應(yīng)文件夾并高亮
	#Invoke-Expression "explorer '/select,.\$fileName'"

	$remoteServer = "[email protected]"
	$shellScript = @'
	cd /www/wwwroot/t.tt/public
	rm -rf work_backup
	mv work work_backup
	unzip -q /tmp/{FILENAME} -d work/
'@
	$shellScript = $shellScript.Replace("`r", "").Replace("{FILENAME}", $fileName)

	Write-Host "正在上傳..."
	scp $fileName "$($remoteServer):/tmp/$($fileName)"
	Write-Host "上傳成功!"
	ssh $remoteServer $shellScript
	Write-Host "部署成功!"
}

如果在終端中運(yùn)行腳本時(shí)出現(xiàn)亂碼， 可以在 CLI 命令執(zhí)行前切換終端編碼為 GB2312，執(zhí)行完成后再切換回 UTF8。

function setUTF8 {
	$OutputEncoding = [console]::InputEncoding = [console]::OutputEncoding = New-Object System.Text.UTF8Encoding
}

function setGB2312 {
	$OutputEncoding = [console]::InputEncoding = [console]::OutputEncoding = [System.Text.Encoding]::GetEncoding("GB2312")
}

function buildUNI {
    ...
    setGB2312
    ...
    &$cli @parameters
    setUTF8
    ...
}