微信小程序CI机器人云构建详解(一)

一、何为CI机器人?

    引用官方的解释,如下

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

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

二、为何要使用CI机器人实现云构建?

我们常规开发中,小程序的体验版和开发版都是通过微信开发者工具来进行的,发布流程过于依赖本地环境,没有实现服务器发布。那么会带来什么痛点呢?

1.本地环境发布是存在风险的,一旦出现问题很难在第一时间找到替代环境

2.整套流程做在本地,整个项目会变得很重(额外的包 + 发布逻辑),包括一些权限,ip白名单的处理也很麻烦

3.没办法平滑的接入CI流程,多个小程序项目发布很头疼,需要不停切换仓库

这个时候 官方给我们提供了一个CI工具。官方有一句话(开发者可不打开小程序开发者工具,独立使用 miniprogram-ci 进行小程序代码的上传、预览等操作),这意思是我们可以脱离开发工具的摆布了,喜大普奔!!!云构建搞起~

三、CI配置以及使用

1. 第一步重中之中!首先我们先去访问"微信公众平台-开发-开发设置"后下载代码上传密钥(一定要记得保存好!),并配置 IP 白名单 开发者可选择打开 IP 白名单,打开后只有白名单中的 IP 才能调用相关接口。

2.脚本调用

npm install miniprogram-ci --save

3.上传配置(预览配置可参考官方示例)

const ci = require('miniprogram-ci')

;(async () => {

  const project = new ci.Project({

    appid: 'wxb5d3fb79bef4623b',

    type: 'miniProgram',

    projectPath: './',

    privateKeyPath: './wx-ci-private.key',

    ignores: ['node_modules/**/*','$node_modules/**/*'],

  })

  const uploadResult = await ci.upload({

    project,

    version: '1.1.1',

    desc: 'hello',

    setting: {

      es6: true,

    },

    onProgressUpdate: console.log,

  })

  console.log(uploadResult)

})()

我的项目CI配置
官方对于配置各项的解释

特别注意privateKeyPath:之前在微信公众平台下载的代码上传密钥,为了方便展示流程我现在直接放在项目跟目录下,大家注意路径,因为之前也开了IP白名单限制,所以不必担心安全问题。

4.执行 yarn wxci:upload 上传体验版,成功后可以在版本管理看到新上传的版本

如果出现{errCode: -10088,errMsg:invalid ip} 这种错误,记得看下自己的设备的IP有没有被加入白名单。

云服务器运行

回归到目标,我们本身目标是为了解决小程序无法在服务器上构建的问题,既然我们把demo写完,那到底能不能运行就该出来溜溜了~~链接我们的服务器,clone一下仓库: https://e.coding.net/lucky_lucy/test/ci-miniprogram.git,记得运行前修改下privateKey里面的内容,换成自己的密匙,大家可以自己试试。

待续 

到这里为止已经实现在云服务器上进行构建 + 上传,但是也仅仅只是换了个环境,怎么接入CI流程才是真正能够提升生产力的东西,后面我们将详细聊聊如何将小程序云构建如何接入jenkins实现持续集成

你可能感兴趣的:(微信小程序CI机器人云构建详解(一))