preface

Recently, I saw an article when TURNING over nuggets: Front-end one-click automatic deployment tool [1], which feels quite consistent with my current scene: The current project of “Hybrid App” is based on the loading of “WebView” of various platforms. However, each release of its “test environment” requires three times of packaging commands to generate codes of three different platforms (small programs, Web and Native), and then upload and deploy the packaged files to “different” server locations. Very troublesome.

Therefore, I wrote a new typescript with the author’s implementation logic, modified it according to my own needs on the basis of basic functions, and added some functions I needed

Tools to address

“CBD – deploy – cli” :

  • Making: github.com/Hyattria/cb…
  • Npm: www.npmjs.com/package/cbd…

Functions overview

The specific usage guide “readme. md” is described in detail, and here is a brief introduction:

The installation

  • Global installation
npm install cbd-deploy-cli -g
Copy the code
  • The local installation
npm install cbd-deploy-cli --save-dev
Copy the code

Initialize the

cbd-deploy-cli init
Copy the code

After init, the develop.config.js file is generated in the current directory based on the configuration entered by the user. Note the following:

  • The deployment environment can be Dev (test environment) or PROD (production environment)

  • Project types include “Web” and “Hybrid App”, which are optional. “Web” is just a generic application, which is probably the most common scenario. The files generated by the two are slightly different. “Hybrid” includes the three platforms of “small program”/” Web “and” Native App “, and it is deployed successively after inputing the deployment command, without additional operations

  • Web App

  • Hybrid App


Ps: Here, if some friends want to use this tool, the type of “Web App” is enough. “Hybrid” is mainly aimed at the pain point of my current work. If someone has the same experience as me, it is really lucky.

The configuration file

Typing the “init” command generates a configuration file, which is recommended because a Hybrid project will have a lot of input.

  • Web App
// deploy.config.js
module.exports = {
  "projectName": "cbd-deploy-cli".  // Development environment
  "dev": {
 "name": "Development environment".// Environment name  "script": "npm run build".// Package command  "host": "localhost".// Server address  "port": 22.// Server port number  "username": "root".// Server login user name  "password": "".// Server login password  "privatekey": "xxxx/.ssh/id_rsa".// The server corresponds to the local private key  / / password | privatekey a can be optional  "distpath": "dist".// Local package generation directory  "webdir": "/".// Server deployment path (cannot be empty or '/')  "isremoveremote": false // Whether to delete remote files (this is directory deletion, please be careful to enable, the upload will be automatically overwritten after decompression)  },  // Production environment  "prod": {  "name": "Production environment". "script": "npm run build". "host": "localhost". "port": 22. "username": "root". "password": "". "privatekey": "xxxx/.ssh/id_rsa". "distpath": "dist". "webdir": "/". "isremoveremote": false  } } Copy the code
  • Hybrid App
module.exports = {
  "projectName": "cbd-deploy-cli".  // Development environment
  "dev": {
    "name": "Development environment".// Notice the difference here
 / / small programs  "mini": {  "script": "npm run build". "host": "localhost". "port": 22. "username": "root". "password": "". "privatekey": "xxx/.ssh/id_rsa". "distpath": "dist". "webdir": "". "isremoveremote": false  },  // web  "web": {  "script": "npm run build". "host": "localhost". "port": 22. "username": "root". "password": "". "privatekey": "xxx/.ssh/id_rsa". "distpath": "dist". "webdir": "". "isremoveremote": false  },  / / native  "native": {  "script": "npm run build". "host": "localhost". "port": 22. "username": "root". "password": "". "privatekey": "xxx/.ssh/id_rsa". "distpath": "dist". "webdir": "". "isremoveremote": false  }  } } Copy the code

The deployment of

Note: the command needs to be followed by a –mode environment object (e.g. –mode=dev or –mode dev)

cbd-deploy-cli deploy --mode=dev    
Copy the code

The program will automatically perform the following operations:

At this time, the project has been successfully sent to the server, the whole process is less than 10 seconds, isn’t it a lot of time to save. In the case of “Hybrid”, it is even more obvious that “programs are issued successively” for three platforms. After a command is typed, all three platforms can be deployed without any operation.

Implementation logic

Here’s a quick description of my implementation logic, because the “Web” logic is mostly borrowed from others and I just rewrote it in typescript with some modifications. But “Hybrid” is an additional function that I add to these foundations, which makes them compatible.

There is no code posted here, the specific implementation can be directly seen on GitHub, with a simple flowchart to write the logic of the whole function:


conclusion

There are not many such functions. The “Hybrid” mode is the function I added according to my own business needs and pain points, and it is compatible with the ordinary release code. If you are interested, you can refer to yourself to add some functions you need

And the function is not too complex, if you want to learn some “Node” knowledge, can be a good practice project, although it does not involve much, but it is much more interesting than some boring business. And after the completion can save a little time, improve the usual development efficiency, why not.

Writing this article is not to let many people use my tools, just want to share their own see, think, do, also welcome the big guy to say my code garbage, as long as can improve, big guy let me pose any pose is ok. /, / /, / /, / / omega)/(✿ ◡ ‿ ◡)

The resources

[1]

The front-end one-click deployment tool automatically: https://juejin.cn/post/6872914108979609614

This article is formatted using MDNICE