preface

Scaffolding tools can quickly generate a complete project structure and help developers focus on the project efficiently.

The implementation principle behind the scaffolding tool on the high surface is not complicated. Vue-cli, for example, essentially pulls different templates from a remote repository (such as GitHub) to the local site based on different operation instructions.

This article will provide a quick guide to creating a scaffold and publishing it to NPM with the author’s Scaffolding (LAN-CLI) example.

Due to the length of this article, this article will not explain the project code, the specific code is stored at the end of the GitHub project address.

Technology stack

  1. Nodejs: Scaffolding framework core;
  2. Commander: Handles command line input.
  3. Co: asynchronous process control tool;
  4. Co-prompt: Step by step, enter command line commands.

The outline

  1. Create a project;
  2. Write instructions;
  3. Configure scaffold information;
  4. Local testing;
  5. Publish scaffolding.

Instance to explain

1. Create projects

2. Write instructions

There are four LAN-CLI commands.

  1. lan add: Project template to add scaffolding
  2. lan list: Lists project templates for scaffolding;
  3. lan delete: Delete scaffold project template;
  4. lan init: initializes the scaffolding project;

    The instruction code is in the figure file.

3. Configure scaffold information

package.json

4. Local tests

Bin/LAN is the scaffold entry file, and the following code is configured in package.json.

"bin": {
        "lan": "bin/lan"
    }
Copy the code

After configuring the entry file, type NPM link on the command line in the root directory to bind the LAN command globally and use the scaffolding directly to test whether it works properly.

5. Post scaffolding

Once the scaffolding is complete, we can publish to NPM.

First, you need to register an account with NPM (www.npmjs.com/). The registration process is omitted.

Then run the login command on the terminal and enter the user name, password, and email address to log in.

npm login
Copy the code

npm publish
Copy the code

After a successful release, you will receive a notification email from NPM. Go to the official NPM, log in to your account, and view the newly released component library.

The project address

Github address: github.com/jiangjiahen… .

conclusion

The above is all the content of this article, thank you for reading, part of the technical points in the article is limited by the length of the article, not explained, if you have any questions or suggestions, please feel free to leave a message, discuss with each other.

Finally, I wish you all the best in your work and a happy life.