微信小程序：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)

})()

特别注意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实现持续集成