多人开发小程序设置体验版的痛点

news2024/11/25 22:28:39

抛出痛点

在分配任务时,我们将需求分为三个分支任务,分别由前端A、B、C负责:

前端A: HCC-111-实现登录功能
前端B: HCC-112-实现用户注册
前端C: HCC-113-实现用户删除

相应地,我们创建三个功能分支:

feature_HCC-111-实现登录功能
feature_HCC-112-实现用户注册
feature_HCC-113-实现用户删除

当所有的前端都开发完成了他们的任务，我们就要开始测试小程序了。但是如果按照以往体验版的测试方式，我们就需要排个顺序。比如，前端 A 先将他的小程序设置为体验版，测试把他的功能测试完成之后，再把前端 B 的设置为体验版，以此类推。可以看出真的很麻烦，而且浪费开发时间，我想你肯定不想在开发的时候突然被叫把你的小程序版本设置为体验版。

解决方案

小程序开发助手 这是一个官方提供的小程序，里面有多个版本的小程序可供选择，很方便测试人员的测试，并且也会节省开发人员的时间。点击版本查看就可以看到所有开发人员提交的最近的一次版本了。这样也不用设置体验版就可以测试最新的提交了。
请添加图片描述

再次抛出痛点

如果前端 A 头上有三个任务单呢？任务单：HCC-121-实现框架搭建，HCC-122-实现在线录屏，HCC-123-实现画板。此时你可能想说, 为啥前端 A 这么多的任务单呢？他命苦啊！

这个时候就需要配合微信的机器人了，我们可以创建多个机器人作为我们提交版本的媒介，这样我们就不受限于微信账号了。

可以在微信的官方文档看到 robot 参数有30个机器人可供选择。

请添加图片描述

接下来看下微信的机器人的使用方式。

miniprogram-ci文档

微信官方是这样介绍这个工具的; miniprogram-ci 是从微信开发者工具中抽离的关于小程序/小游戏项目代码的编译模块。它其实是一个自动上传代码的工具，可以帮助我们自动化的编译代码并且上传到微信。

下面是一个大概得使用的示例，具体还是要参考官方文档。

const ci = require('miniprogram-ci');
(async () => {
  const project = new ci.Project({
    appid: 'wxsomeappid',
    type: 'miniProgram',
    projectPath: 'the/project/path',
    privateKeyPath: 'the/path/to/privatekey',
    ignores: ['node_modules/**/*'],
  })
  const previewResult = await ci.preview({
    project,
    desc: 'hello', // 此备注将显示在“小程序助手”开发版列表中
    setting: {
      es6: true,
    },
    qrcodeFormat: 'image',
    qrcodeOutputDest: '/path/to/qrcode/file/destination.jpg',
    onProgressUpdate: console.log,
    // pagePath: 'pages/index/index', // 预览页面
    // searchQuery: 'a=1&b=2',  // 预览参数 [注意!]这里的`&`字符在命令行中应写成转义字符`\&`
  })
  console.log(previewResult)
})()

当我们使用这个脚本上传完代码就可以在小程序开发助手或者小程序管理平台看到以下内容。

微信管理后台
请添加图片描述
小程序开发助手页面
在这里插入图片描述

最后

我们可以使用 miniprogram-ci 配合 Jenkins 实现自动化部署，提交完成代码就可以自动部署了。以下是一个 github 的 actions 示例。当然也可以使用别的方式，例如本地提交，Jenkins提交等。

name: Feature Branch CI

on:
  workflow_dispatch:
  push:
    branches: ['feature_*']  # 使用通配符匹配所有feature分支

jobs:
  build_and_deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout Repository
        uses: actions/checkout@v3

      - name: Setup Node.js
        uses: actions/setup-node@v3
        with:
          node-version: '20'
          cache: 'yarn'

      - name: Install dependencies
        run: |
          npm install -g miniprogram-ci cross-env
          yarn install --frozen-lockfile

      - name: Build Package
        run: yarn cross-env ENV=PROD uni build -p mp-weixin --mode PROD

      - name: Create private key file
        run: echo "${{ secrets.PRIVATE_KEY }}" > private.key

      - name: Deploy Package
        env:
          APP_ID: ${{ secrets.APP_ID }}
        run: |
          COMMIT_MESSAGE=$(git log --format=%B -n 1 ${{ github.sha }})
          if [[ $COMMIT_MESSAGE =~ VERSION-([A-Za-z0-9_]+-[A-Za-z0-9_-]+)_DEV ]]; then
            VERSION=${BASH_REMATCH[1]}
            echo "Extracted Version: $VERSION"
            miniprogram-ci preview \
              --pp ./dist/build/mp-weixin \
              --pkp ./private.key \
              --appid $APP_ID \
              --uv "${VERSION}" \
              -r 7 \
              --desc "${COMMIT_MESSAGE}" \
              --upload-description "${COMMIT_MESSAGE}" \
              --enable-es6 true \
              --enable-es7 true \
              --enable-minifyJS true \
              --enable-minifyWXML true \
              --enable-minifyWXSS true \
              --enable-minify true \
              --enable-bigPackageSizeSupport true \
              --enable-autoPrefixWXSS true
          else
            echo "No Version found in commit message. Skipping upload."
          fi