Taro 自动部署微信+支付宝小程序方法

使用taro3同时开发 微信小程序 + 支付宝小程序;常规上传方式为:在本地打包完微信使用开发者工具上传;再次打包支付宝使用支付宝开发者工具上传;相对繁琐;所以使用ci机器人配合jenkins达到提交代码自动部署双平台并且发送飞书消息通知

1. 微信小程序自动上传体验版

1.1 安装相关插件依赖

小程序持续集成 借助该文档的plugin-mini-ci插件进行机器人自动部署功能

1.2 微信小程序机器人部署代码配置

打包配置修改:

// config/index.js
const CIPluginOpt = {
  // 微信小程序
  weapp: {
    appid: 'appid',
   // 在开放平台下载的密钥文件;放到根目录的路径;见下图
    privateKeyPath: 'private.appid.key'
  },
  // 版本号
  version: '0.0.2',
  // 版本发布描述
  desc: '版本描述'
// ....其他代码
const config = {
  // 其他代码
  plugins:[['@tarojs/plugin-mini-ci', CIPluginOpt], '@tarojs/plugin-html', 'taro-plugin-pinia'],
  }
}

1.3 设置自动上传体验版白名单

添加打包后上传ip白名单:

设置自动上传体验版白名单

1.4 配置npm打包+上传命令

// package.json
"build:weapp:upload": "taro build --type weapp --upload",

使用npm run build:weapp:upload 即可完成本地打包后成功上传到体验版。

配置npm打包+上传命令

至此微信小程序本地打包自动部署到体验版已经完成![撒花🎉]

2. 支付宝小程序自动上传到体验版

支付宝小程序体验版版本号相对严格(需要本次上传的版本号必须大于上次的版本号)

2.1 安装相关插件依赖(和1相同)

小程序持续集成 借助该文档的plugin-mini-ci插件进行机器人自动部署功能

2.2 修改上传前版本号

  • 可以手动的修改版本号然后继续
  • 也可以使用nodejs修改版本号然后继续

补充:使用nodejs修改项目package.json版本号方法

详细代码如下(nodejs简陋); 注释了自动创建分支+提交动作;可根据需求自行使用:

//build.js文件
var exec = require('child_process').exec // 异步子进程
var fs = require('fs')

var packageJSON = require('./package.json')
/** package.json文件的version参数 */
var version = packageJSON.version
/** 命令行的所有参数 */
var options = process.argv
/** 命令行的type参数 */
var type = null
/** 新的version参数 */
var newVersion = null

//判断命令行是否存在type参数或version参数进行逻辑处理
for (let i = 0; i < options.length; i++) {
  if (options[i].indexOf('type') > -1) {
    //存在type参数
    type = options[i].split('=')[1]
  } else if (options[i].indexOf('version') > -1) {
    //存在version参数
    newVersion = options[i].split('=')[1]
  } else {
    //code
  }
}

if (newVersion) {
  //存在设置version参数则改变原来的version
  version = newVersion
} else if (type) {
  //不设置version则根据type来进行修改version
  version = handleType(version, type)
} else {
  version = null
  console.log('-----------没有改变version-----------')
}

//修改了version则写入
if (version) {
  packageJSON.version = version
  //同步写入package.json文件
  fs.writeFileSync('package.json', JSON.stringify(packageJSON, null, 2))
  console.log('-----------更新package的version为:%s参数成功-----------', version)
  // handleGitAdd('./package.json')
  // pullRemote()
}

/**
 * 根据分支类型处理版本号version
 * @param {string} oldVersion 旧的版本号
 * @param {string} type 分支类型
 * @private
 */
function handleType(oldVersion, type) {
  var oldVersionArr = oldVersion.split('.')
  //版本号第一位 如:1.2.3 则为 1
  var firstNum = +oldVersionArr[0]
  //版本号第二位 如:1.2.3 则为 2
  var secondNum = +oldVersionArr[1]
  //版本号第三位 如:1.2.3 则为 3
  var thirdNum = +oldVersionArr[2]
  switch (type) {
    case 'release':
      //release分支的处理逻辑
      ++secondNum
      thirdNum = 0
      break

    case 'hotfix':
      //hotfix分支的处理逻辑
      ++thirdNum
      break

    default:
      // 默认按照最小版本处理
      ++thirdNum
      break
  }

  return firstNum + '.' + secondNum + '.' + thirdNum
}

// /**
//  * 将package.json推送到远程新创建的分支
//  */
// function pullRemote() {
//   var branch = type + '/' + version
//   //创建新分支
//   handleGitCreate(branch)
// }

// /**
//  * 创建新分支
//  * @param {string} branch 分支名
//  */
// function handleGitCreate(branch) {
//   exec('git branch ' + branch, function (error, stdout, stderr) {
//     console.log('-----------创建新分支:%s DONE-----------', branch)
//     //切换分支
//     handleGitCheckOut(branch)
//   })
// }

// /**
//  * 切换分支
//  * @param {string} branch 分支名
//  */
// function handleGitCheckOut(branch) {
//   exec('git checkout ' + branch, function (error, stdout, stderr) {
//     console.log('-----------切换新分支:%s DONE-----------', branch)
//     //添加修改文件
//     handleGitAdd('./package.json')
//   })
// }

/**
 * 添加修改文件
 * @param {string} filePath 文件路径
 */
function handleGitAdd(filePath) {
  exec('git add ' + filePath, function (error, stdout, stderr) {
    console.log('[添加修改文件输出:%s]', stdout)
    //提交文件
    handleGitCommit('更新package.json文件')
  })
}

/**
 * 提交文件
 * @param {string} prompt commit文字备注
 */
function handleGitCommit(prompt) {
  // var branch = type + '/' + version
  exec('git commit -m "' + prompt + '"', function (error, stdout, stderr) {
    console.log('[提交修改文件输出:%s]', stdout)
    //推送分支
    handleGitPush()
  })
}

/**
 * 推送分支
 */
function handleGitPush() {
  exec('git push ', function (error, stdout, stderr) {
    console.log('[推送至分支:%s输出:%s]', stdout || error || stderr)
    console.log('-----------提交修改文件完成-----------')
  })
}

/**
 * 自动生成版本号脚本思路
 * 1.获取传进来的参数 √
 * 2.根据参数进行逻辑处理 √
 * 3.获取package.json中的version参数 √
 * 4.修改version的值写入package.json文件 √
 * 5.git提交package.json文件 √
 */

使用:

  • node build.js --type=hotfix 只修改最小版本
  • node build.js --type=release 修改功能版本
  • node build.js --type=release --version=0.0.8 修改为指定版本

2.3 支付宝小程序机器人部署代码配置

打包配置修改:

// config/index.js
// 引入package.json内的版本号
import packageData from '../package.json'
const CIPluginOpt = {
  // 微信小程序
  weapp: {
    appid: 'appid',
   // 在开放平台下载的密钥文件;放到根目录的路径;见下图
    privateKeyPath: 'private.appid.key'
  },
  // 支付宝小程序
  alipay: {
    appId: '支付宝小程序appid',
    toolId: '使用工具生成(见2.3.1),
    privateKeyPath: '私钥使用工具生成(见2.3.1)'
  },
  // 版本号(如果是微信小程序就固定002;可以不用更新体验版二维码图片;其他直接读package.json的版本号)
  version: process.argv.includes('weapp') ? '0.0.2' : packageData.version,
  // 版本发布描述
  desc: '版本描述'
// ....其他代码
const config = {
  // 其他代码
  plugins:[['@tarojs/plugin-mini-ci', CIPluginOpt], '@tarojs/plugin-html', 'taro-plugin-pinia'],
  }
}

2.3.1 生成配置需要的 toolId

安装工具:

npm install alipay-dev -g

工具初始化配置:

(1)运行 alipaydev key create -w 生成密钥。
工具初始化配置

(2)运行 alipaydev key upload 自动打开浏览器配置页或直接前往 工具密钥设置 页面,配置工具公钥(第一步中生成的 公钥)以及设置 IP 白名单(可选),设置完成后系统会为您分配一个工具 ID(toolId)。

配置工具公钥

2.4 配置npm打包+上传命令

"build:alipay:upload": "taro build --type alipay --upload",

没有修改版本号的结果:

没有修改版本号的结果

修改大于上次体验版的结果:

修改大于上次体验版的结果

结语

以上就是关于Taro 自动部署微信+支付宝小程序(附带动态修改支付宝体验版版本号),属于实战教程吧,个人觉得不错,转载学习,原文链接点击这里

「点点赞赏,手留余香」

0

给作者打赏,鼓励TA抓紧创作!

微信微信 支付宝支付宝

还没有人赞赏,快来当第一个赞赏的人吧!

使用声明:
1. 本站所有素材(未指定商用),仅限学习交流。
2. 会员在本站下载的VIP素材后,只拥有使用权,著作权归原作者及码云笔记网所有。
3. 原创商用和VIP素材,未经合法授权,请勿用于商业用途,会员不得以任何形式发布、传播、复制、转售该素材,否则一律封号处理。
4. 本平台织梦模板仅展示和个人非盈利用途,织梦系统商业用途请预先授权。
码云笔记 » Taro 自动部署微信+支付宝小程序方法

发表回复

IT互联网行业相关广告投放 更专业 更精准

立即查看 联系我们