微信小程序自动上传&命令行交互 miniprogram-ci+inquirerJs

2,312 阅读2分钟

前言

大家好,我是啊肥,在使用uni-app的时候发现了这么一个问题,dev时需要开一个开发工具,当build需要上传代码时需要再打开一个,对于电脑不是很优秀的同学就很难受了(比如我),一系列百度后发现微信小程序自动上传——miniprogram-ci

准备工作

密钥

微信公众平台-开发-开发管理-开发设置中下载密钥,并且需要配置IP白名单。

安装

安装miniprogram-ci

npm i miniprogram-ci --save

编写脚本/执行

脚本

最重要的一步,需要给项目增加一个node脚本,根目录创建uploadWx.js

const ci = require('miniprogram-ci')

// 创建项目对象
const project = new ci.Project({
  appid,    // 小程序appid
  type: 'miniProgram',  // 类型,小程序或小游戏
  projectPath: process.cwd(), // 项目路径
  privateKeyPath: 'xxxx',  // 密钥路径
  ignores: ['node_modules/**/*'],  // 忽略的文件
})
// 调用上传方法
ci.upload({
  project,
  version,
  desc,
  setting: {
    es6: true, // 是否 "es6 转 es5"
    minify: true,  // 是否压缩代码
  },
}).then(res => {
  console.log(res)
  console.log('上传成功')
}).catch(error => {
  if (error.errCode == -1) {
    console.log('上传成功')
  }
  console.log(error)
  console.log('上传失败')
  process.exit(-1)
})

执行

node uploadWx.js

inquirerJs

当我们打包完毕再执行上传代码,会多了一层的步骤,我发现了inquirer这个模块,如果在一些脚手架创建项目是看到某些选择选择yes/no的,是的,这个东西可以实现

实现的目的,在我们打包结束后将会弹出提示是否上传代码,y的时候会调用上文所说的ci

为什么会有no的情况呢,因人而异,对于本公司的情况,在某些时候需要给测试同事看数据,模拟用户之类的操作,打包代码预览,但是这时候我不喜欢这部分代码上传到公众平台

介绍

这是一个用户与命令行交互的工具

这个文章挺不错的

在这不详细介绍,主要目的是实现我们这一部分的功能,有兴趣的同学可以去详细了解一波

使用

inquirer有很多种类型,在这里我们只用到了confirm,也就是yes/no

脚本方法我们可以在上述的js继续编写

 const ci = require('miniprogram-ci');
 const inquirer = require('inquirer');

 创建项目对象
 const project = new ci.Project({
   appid, // 小程序appid
   type: 'miniProgram', // 类型,小程序或小游戏
   projectPath: process.cwd(), // 项目路径
   privateKeyPath: 'xxx', // 密钥路径
   ignores: ['node_modules/**/*'], // 忽略的文件
 });

 const uploadWx = () => {
   // 调用上传方法
   ci.upload({
     project,
     version,
     desc,
     setting: {
       es6: true, // 是否 "es6 转 es5"
       minify: true, // 是否压缩代码
     },
   })
     .then(res => {
       console.log(res);
       console.log('上传成功');
     })
     .catch(error => {
       if (error.errCode === -1) {
         console.log('上传成功');
       }
       console.log(error);
       console.log('上传失败');
       process.exit(-1);
     });
 };

(() => {
  inquirer
    .prompt([
      {
        name: 'confirm',
        type: 'confirm',
        message: '是否上传代码',
        default: true,
      },
    ])
    .then(res => {
      console.log(res.confirm);
      if (res.confirm) {
        uploadWx();
      }
    });
})();

最终执行

最终在package.json修改一下build的运行

"build": "cross-env NODE_ENV=production UNI_PLATFORM=mp-weixin vue-cli-service uni-build && node uploadWx.js"

最终结果

image.png