Introduction to the

Miniprogram -deploy automatically uploads micro – app based on miniprogram-ci using configuration file + command.

preface

We're probably working on H5, starting a lot of processes.

We may be noodling, chrome has a million tabs open.

We could be...

  • Product A: Brother help to change the copy of A small program page
  • Me: modify copy, open small program developer tools, package upload, in one go!
  • Product A: 6 Ah brother! So fast!
  • Me: smile and turn off the widget developer tools as if nothing had happened

…

  • Product B: Brother help to change a small program copy
  • Me: ？？？？ I just turned off the developer tool. I can’t open my computer card once
  • Product B: Then why did you close it?
  • I: open occupy memory! Stop beeping! Get the copy! I’ll change it!

Are you very upset? We had to open up that huge developer tool and upload code just to change a copy!

miniprogram-ci

At this time, I found that wechat had already provided the CI tool miniprogram-CI. Please take a look at its official introduction:

Miniprogram-ci is a compilation module for small program/small game project code extracted from [wechat developer tools]. Before using it, you need to access "[wechat public Platform]- development-Development Settings "as a small program administrator, download the code upload key, and configure the IP whitelist, before uploading and preview operations. Miniprogram-ci has been supporting uploads and previews for third-party development since 1.0.28, invoking the same way as normal development mode.Copy the code

That’s great! This will solve my problem, let’s see how to use:

miniprogram-ci \ upload \ --pp ./demo-proj/ \ --pkp ./private.YOUR_APPID.key \ --appid YOUR_APPID \ --uv PACKAGE_VERSION  \ -r 1 \ --enable-es6 true \Copy the code

Hold grass this command parameters are too much!! It seems very troublesome to use? How to simplify it?

  • Manually execute this command each time to upload

Obviously not realistic, do you have to write it down in your own little book and copy it over every time?

  • Put this command in NPM script

For example, to create a new upload, NPM run upload will be used every time. The problem with this is that you need to change the PACKAGE_VERSION in the command every time you publish it. Changing package.json frequently is obviously not appropriate, and you can easily cause a P0 accident.

A more simple to use publishing tool miniprogram-deploy

  • I want to simply execute one command at a time
  • Files that don’t want to change business code frequently

Based on the above demands, we can write a publishing tool based on miniprogram-CI and let it have its own configuration file. All publishing changes are limited to this configuration file.

Miniprogram-deploy was born!

Simply run miniprogram-deploy Upload to upload the applet!

Here’s a look at what commands the tool provides:

miniprogram-deploy init

The configuration file cannot be written manually. It is better to provide an initialization command to initialize the configuration file.

Since the init command only needs to be executed once, we use the Inquirer to do a graphical command-line interaction

After guiding the user through a few simple fields, we can generate our own configuration file!

miniprogram-deploy doctor

For our publishing tool, does this configuration file just need to exist?

Of course not! We need to verify at runtime that the fields in the file are as expected!

Since we are miniprogram-deploy in typescript, we would expect validation based on ts type definitions.

The current scheme is to first convert the TS type definition into JSONSchema, and then use JsonSchema to verify JSON data.

typescript-json-schema

There is a library called typescript-JSON-Schema that makes it very easy to generate JSONSchema based on a TS file.

Let’s take a quick look at the type definition of ts

Conversion to jsonschema looks like this

All that is left is to automatically build the jsonschema, so we can generate the jsonschema once before each packaging and upload it to NPM with the packaged files.

jsonschema

There is a library called JsonSchema that makes it very easy to validate JSON data at run time against a certain JsonSchema.

Run the check

Let’s see what the difference is between a check pass and a check fail

Check by

✔ mp - deploy. Config. Json check passed

Check failure

{
    "type": "miniProgram"."version": 2.1.1 ""."desc": "Test"."projectPath": "."} * deploy.config.json check failed instance requires property"privateKeyPath"
Copy the code

or

{
    "type": "miniProgram"."privateKeyPath": 0."version": 2.1.1 ""."desc": "Test"."projectPath": "."} * deploy.config.json check failed instance.privateKeyPath is not of a type(s) stringCopy the code

miniprogram-deploy upload

Miniprogram-ci requires more fields when uploading, but we only need a configuration file with at least 3 fields.

So how are the other fields retrieved? Json in the user code directory to avoid repeated input and configuration.

How is the uploaded information output to the command line? In the process of uploading, we expect users to feel the uploading process intuitively and output beautiful command line information to users. Therefore, ORA and Chalk package ConsoleOutput for unified output processing.

Take a look at the final output

Write in the last

Miniprogram-deploy automatically uploads miniprograms based on miniprogram-CI by using configuration file + command. The miniprogram files can be uploaded with a single command, which can be easily added to Jenkins’ CI CD process.

Please do not reprint without permission, reprint please indicate the original author and original link