在开发小程序时,如果需要本地打包上传,就需要经过运行打包命令、打开开发者工具、点击上传、输入版本号等信息等步骤,如果碰到需要同时打包多个小程序的情况,这些步骤就会显得很繁琐和混乱。
命令行调用
微信开发者工具提供了命令行与 HTTP 服务两种接口供外部调用,可以一部分解决预览、上传等操作较为繁琐的问题,这里主要介绍下命令行调用的方式。
启用命令行工具
要使用命令行工具,需要在开发者工具的设置 -> 安全设置中开启服务端口
验证工具
先到命令行工具所在位置
macOS: <安装路径>/Contents/MacOS/cli
Windows: <安装路径>/cli.bat
以开发工具默认安装路径为例 (注释的是 win 平台,后面类似)
bash
cd /Applications/wechatwebdevtools.app/Contents/MacOS
# cd C:/Program Files (x86)/Tencent/微信web开发者工具
bash
./cli islogin
# cli islogin
如果成功启用了命令行工具,结果应该类似图片的
命令行登录
命令行后续操作都行先进行登录,一般只需要登录一次,后续即使重启机器也不需要重新登录。
bash
./cli login
# cli login
打包脚本
知道命令行指令后,我们可以与打包命令一起集成为一个脚本。这里的项目例子是uni-app的默认模版。
zx
考虑到跨平台需求,这里不考虑 shell。node 的 child_process 虽然可以跨平台执行命令,但略显繁琐,比较方便的是使用第三方包,比较比较知名的有shelljs与zx,综合考虑这里使用的zx。
需要先在项目或者全局安装 zx
bash
npm i -g zx
脚本
在项目目录下新建一个文件upload.mjs
jsx
#!/usr/bin/env zx
const cliPath = "/Applications/wechatwebdevtools.app/Contents/MacOS/cli";
// win 默认路径
// const cliPath = 'C:/Program Files (x86)/Tencent/微信 web 开发者工具/cli.bat'
let cliCmd = cliPath;
// 打包
await $`git checkout main`;
await $`git pull`;
// await $`yarn install`;
await $`yarn build:mp-weixin`;
// 项目打包路径
const projectPath = path.resolve(__dirname, "./dist/build/mp-weixin");
// 项目描述
const desc = "描述";
// 项目版本,可以记录在外部文件中
const version = "1.0.0";
// 因为 zx 在 win 使用的 bash,需要用 cmd 执行 cli.bat
if (os.platform() === "win32") {
cliCmd = `/mnt/c/Windows/System32/cmd.exe /c "${cliPath}"`;
$.quote = (str) => {
return str;
};
}
// 运行 cli 命令
await $`${cliCmd} upload --project ${projectPath} -v ${version} -d ${desc}`;
运行
直接在项目目录下运行
zx upload.mjs
运行完成后最后的输出结果应该类似于