Demo repository: github.com/jinxuanzhen… , have time best warehouse clone down run again, very simple

CI Process building teaching trilogy:

  • Implementing cloud builds
  • How to access CI (Jenkins one-click release)
  • Build a version release management background + enterprise wechat robot crowd notification

background

Since the birth of WeChat applet, upload/generate development experience editions of this thing is inseparable from the WeChat developer tools, the first is dependent on the manual to some ide on the upload button, and then is that WeChat open out of the call command line interface But still can not solve the problem of a fundamental is not released server (developer tools without Linux version, Cloud server buy Windows when I didn’t say…) The publishing process depends on the local environment, and there are three problems:

  • Local environment publishing is risky, and it is difficult to find an alternative environment in the first place
  • The whole process is done locally, the whole project becomes heavy (extra package + distribution logic), including some permissions, and IP whitelist processing is also cumbersome
  • ** There is no smooth access to CI process, ** multiple small program project release is a headache, need to keep switching warehouses

This is the same problem we encountered in the previous solution

An opportunity to

I usually keep a week over the habit of document (quantum reading, manual funny ~ ~), found in the document out something called a CI documents address: developers.weixin.qq.com/miniprogram…




Developers do not need to open the small program developer tool, and independently use miniprogram-CI to upload and preview the small program code
Does that mean you can build on the server (cloud build)?


Let’s Go

The directory structure

Due to the use of NPM package, in order to avoid the installation of minprogram-CI package that will not be used in the project, we need to make some adjustments on the original directory structure, mainly outsourcing a layer in the project. In addition to installing MinProgram-CI, you can also install other things that will be used during the build process


CI configuration

Add ci.js file, which is equivalent to our entry code, reference the node package minprogram-ci, and configure the appID, project path, private key, the official document is written clearly, I quickly here













Basic Function realization

Miniprogram-ci is basically a copy of the command line tools provided by the developer tools, which will not be described here, mainly writing down the function of uploading code

// new CI instance
const project = new ci.Project({
    appid: projectConfig.appid,
    type: 'miniProgram'.projectPath: projectConfig.miniprogramRoot,
    privateKeyPath: './ci-private.key'.ignores: ['node_modules/**/*']});Upload / * * * /
async function upload({version = '0.0.0', desc ='test'}) {
    await ci.upload({
        project,
        version,
        desc,
        setting: {
            es7: true.minify: true.autoPrefixWXSS: true
        },
        onProgressUpdate: console.log,
      })
}

upload({version: "1.2.3".desc: '2222'}) 
Copy the code

Call the Upload method provided by CI, and drop the previously generated project instance into the corresponding attribute, version and desc respectively










Perform upload

This upload function is about 23 lines of code. It’s simple and quick, and it’s basically just a matter of configuring the options 👌























Promote happiness with interactive commands

Inquirer’s documentation: github.com/SBoudrias/I…

If you do not plan to access Jenkins CI platform, you can consider using inquirer package, to solve the handwritten version number caused by the embarrassment of forgetting, write wrong first install

npm install inquirer
Copy the code

Write a simple command

function inquirerResult() {
    return inquirer.prompt([
        // Set the version number
        {
          type: 'input'.name: 'version'.message: 'Sets the version number of the upload:',},// Set the upload description
      {
          type: 'input'.name: 'versionDesc'.message: Write a brief description of the changes made to this version: ',}]); }async function init() {
    let result = await inquirerResult();  
    console.log(result);      / / output
}

init();
Copy the code

Re-execute, and we get an object, key name is the name we set, value is the value we entered















/** entry function */
async function init() {
  	// Version information
    let versionData = await inquirerResult(versionConfig);
  	
	  // Version release
		await upload();
  
  	// Rewrite the version file
    fs.writeFileSync('./version.config.json'.JSON.stringify(versionData), err => {
        if(err) {
            console.log('Failed to write app.json file automatically, please fill it out manually and check for errors'); }}); }Copy the code

The specific version number increment logic demo warehouse has, here will not stick, general effect:





Cloud Server Running

Return to the goal, our own goal is to solve the small program can not build on the server, since we finished the demo, that in the end can run on the show ~~ link our server, clone the warehouse: github.com/jinxuanzhen… Change the contents of ci-private.key to your own key before running it. Otherwise, an IP error will be reported.

git clone https://github.com/jinxuanzheng01/blog-xcx-ci-demo.git
cd blog-xcx-ci-demo && npm i
node start.js
Copy the code

Perform upload:















To be continued

So far, we have implemented build + upload on cloud server, but it is just a change of environment. How to access CI process is the real thing that can improve productivity

reading

“Small Card small program Automation Construction and Release of engineering practice” “From 0 to 1 to develop a small program CLI scaffolding (II) — Version release/Management chapter”