前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >实现小程序的持续集成

实现小程序的持续集成

作者头像
terrence386
发布2022-07-14 21:05:34
6860
发布2022-07-14 21:05:34
举报

为中华民族的伟大复兴而读书。

前情回顾

上篇文章分享了的一个实现基于git hooks的持续集成的问题,我们已经可以简单的利用git的钩子实现持续集成,那么小程序是否也可以实现持续集成呢,今天我们要聊一个这个问题。

目前发布小程序现状

在小程序开发过程中,大多数的开发者开发完成后,都是通过开发者工具进行编译、预览、上传,然后登录小程序后台,进行发布。

可能很少人关注小程序的CI辅助工具,miniprogram-ci

miniprogram-ci是什么

miniprogram-ci 是从微信开发者工具中抽离的关于小程序/小游戏项目代码的编译模块。

开发者可不打开小程序开发者工具,独立使用 miniprogram-ci 进行小程序代码的上传、预览等操作。

miniprogram-ci能做什么

  • 上传代码,对应小程序开发者工具的上传
  • 预览代码,对应小程序开发者工具的预览
  • 构建 npm,对应小程序开发者工具的: 菜单-工具-构建npm
  • 上传云开发云函数代码,对应小程序开发者工具的上传云函数能力
  • 代理,配置 miniprogram-ci 的网络请求代理方式
  • 支持获取最近上传版本的 sourceMap
  • 支持 node 脚本调用方式和 命令行 调用方式

如何用miniprogram-ci上传代码

第一,需要到微信公众平台配置密钥及 IP 白名单

使用 miniprogram-ci 前应访问"微信公众平台-开发-开发设置"后下载代码上传密钥,并配置 IP 白名单 开发者可选择打开 IP 白名单,打开后只有白名单中的 IP 才能调用相关接口。我们建议所有开发者默认开启这个选项,降低风险 代码上传密钥拥有预览、上传代码的权限,密钥不会明文存储在微信公众平台上,一旦遗失必须重置,请开发者妥善保管

第二,在项目中安装miniprogram-ci的npm 包

代码语言:javascript
复制
npm install miniprogram-ci --save

第三,创建文件编写上传代码。

写这个代码之前需要明白项目对象的概念。可以理解它是对整个小程序的一种抽象,定义如下:

代码语言:javascript
复制
interface IProject {
  appid: string // 小程序/小游戏项目的 appid
  type: string // 项目的类型,有效值 miniProgram/miniProgramPlugin/miniGame/miniGamePlugin
  projectPath: string //项目的路径,即 project.config.json 所在的目录
  privateKey: string //私钥,在获取项目属性和上传时用于鉴权使用,在 微信公众平台 上登录后下载 
  attr(): Promise<IProjectAttr> // 项目的属性,如指定了 privateKey 则会使用真实的项目属性
  stat(prefix: string, filePath: string): IStat | undefined // 特定目录下前缀下(prefix)文件路径 (filePath) 的 stat, 如果不存在则返回 undefined
  getFile(prefix: string, filePath: string): Promise<Buffer> // 特定目录下前缀下(prefix)文件路径 (filePath) 的 Buffer
  getFileList(prefix: string, extName: string): string[] // 特定目录下前缀下(prefix)文件路径 (filePath) 下的文件列表
  updateFiles: () => void // 更新项目文件 
}

然后就可以来实现一个上传的功能了,比如官方文档上的代码:

代码语言:javascript
复制
// upload.js

// 引用 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 uploadResult = await ci.upload({
    project,
    version: '1.1.1',
    desc: 'hello',
    setting: {
      es6: true,
    },
    onProgressUpdate: console.log,
  })
  // 打印上传结果
  console.log(uploadResult)
})()

我们可以将这个代码当成一个命令放到package.json文件中

代码语言:javascript
复制
// package.json
{
  "name":"miniProgram",
  "version":"1.0.0",
  "scripts":{
    "npm run upload": "node ./upload.js"
  }
}
  

这样我们本地开发完成后执行npm run upload即可完成小程序的上传工作。

预览功能同理。

实现小程序的持续集成

结合上一篇文章聊过的实现持续集成的方案,我们只需要在git hookspost-update钩子中,配置上对应小程序的上传脚本即可实现小程的持续集成。

有可能需要考虑的问题---> 在预览时能够显示预览的二维码。

总结

  • 需要知道miniprogram-ci
  • 需要知道miniprogram-ci包,对外提供的api
    • upload 上传
    • preview 预览
    • packNpm 构建npm
    • getDevSourceMap 拉取最近上传版本的sourceMap

javascript基础知识总结

本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2021-04-01,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 JavaScript高级程序设计 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 前情回顾
  • 目前发布小程序现状
  • miniprogram-ci是什么
  • miniprogram-ci能做什么
  • 如何用miniprogram-ci上传代码
  • 实现小程序的持续集成
  • 总结
相关产品与服务
云开发 CloudBase
云开发(Tencent CloudBase,TCB)是腾讯云提供的云原生一体化开发环境和工具平台,为200万+企业和开发者提供高可用、自动弹性扩缩的后端云服务,可用于云端一体化开发多种端应用(小程序、公众号、Web 应用等),避免了应用开发过程中繁琐的服务器搭建及运维,开发者可以专注于业务逻辑的实现,开发门槛更低,效率更高。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档