前言
在开发 UniApp H5 项目时,随着版本迭代,我们需要不断发布测试版本到线上给测试人员使用;虽然 HBuilderX 点两下就可以打包,但是打包、压缩、再上传还是稍显繁琐。好在 HBuilderX 提供了 CLI 工具,结合 CLI 和其他脚本工具我们可以做到一键打包、发布、并上传部署。
HBuilderX 仅适配了 Windows 和 macOS 平台,本文只研究 Windows 平台如何实现自动化,使用 macOS 平台的朋友对照着 PowerShell 脚本内容,将脚本内容替换成适配 ZSH 的 Shell 脚本即可。
思路
实现思路比较简单,大体步骤如下:
1. 使用 HBuilderX 提供的 CLI 工具打包 UniApp 项目
2. 将打包产物压缩成 zip 文件
3. 弹出文件浏览器并选中高亮 zip 文件
4. 一键上传至测试服务器
脚本内容
这一段比较简单,配置 CLI 路径之后读取当前项目目录,以当前目录路径作为项目路径来进行打包,这意味着我们运行此脚本时需要在项目根目录来运行。
使用时请自行替换 CLI 路径为 HBuilderX 安装路径,CLI 路径以及更多用法参见: 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
将打包产物压缩成 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 "压缩完成!"
可以使用如下命令打开文件管理器并高亮对应的 zip 文件:
Invoke-Expression "explorer '/select,.\$fileName'"
如果需要自动部署至 Linux 服务器上,需要配置免密登录,大家可以参考这篇文章来实现: https://www.cnblogs.com/caibaotimes/p/14194044.html
自动部署具有一定的风险性,请使用时务必谨慎,确保理解了脚本的每一行含义之后再使用,本人对该脚本带来的一切后果概不负责。
自动部署
自动部署至 Linux 服务器的思路如下:
1. 上传 zip 文件至服务器
2. 备份原有资源文件
3. 解压 zip 文件到项目对应路径
remoteServer 是 SSH 相关配置,将 root 替换为相应用户名, t.tt 替换为服务器对应域名。
另外 shellScript 脚本也需要另行修改,例如前端项目路径为 /opt/project/web,则将脚本第一行中 cd 之后紧跟的项目根路径 /www/wwwroot/t.tt/public 替换为 /opt/project, 脚本中存在的其他 work 目录替换为 web 目录 。
$remoteServer = "root@t.tt"
$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
编写完脚本后,还需要将该脚本封装为函数,并写进 PowerShell 的配置文件中,这样我们才能在终端中随时调用该打包命令。
PowerShell 的配置文件位于 C:\Users\{用户名}\Documents\PowerShell\Microsoft.PowerShell_profile.ps1,如果该文件不存在,请自行创建。
在文件中新建一个名为 buildUNI 的函数,配置相关内容之后关闭该配置文件;新开启一个终端窗口,切换到 UniApp 项目根目录,输入刚才新建的函数内容,即可开始愉快的打包啦~
以下是完整脚本,Enjoy~
function buildUNI {
# 打包H5平台文件
$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 "压缩完成!"
# 打开对应文件夹并高亮
#Invoke-Expression "explorer '/select,.\$fileName'"
$remoteServer = "root@t.tt"
$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 "部署成功!"
}
如果在终端中运行脚本时出现乱码, 可以在 CLI 命令执行前切换终端编码为 GB2312,执行完成后再切换回 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
...
}