It’s a short, honest article that you can read in less than two minutes and you’ll probably be amazed at how easy it is to develop your own code generator

Note: This is a continuation of ncgen’s code Generator. If you don’t know ncgen, you should check out ncGen’s code Generator.


Daniel: Dude, following the instructions you gave me after our last meeting, I configured a code generator that fully meets my needs in just a few minutes. It’s so powerful and simple

Mr. Egg: just do it. I admire your hands-on ability

Daniel: Laugh and see. But I’m here today with a question

Mr. Egg: Wait a long time

Daniel: I put ncgen-config.js in the cloud, and my friends complained that the command was too long to remember when I used it:

$ ncgen https://raw.githubusercontent.com/daniel-dx/vue3-ncgen-demo/master/ncgen-config.js
Copy the code

Look, isn’t it a bit long? Any good advice from egghead?

Mr. Egg: Of course, NCGen already has a very fascinating plan for this

Daniel: What charming plan? How glamorous? Just tell me, just tell me

Mr. Egghead: That’s it – quickly develop your own code generator with NCGen

Daniel: Wo~, belong to my own, listen to the wonderful, yesterday? Yesterday to get?


Mr. Egghead: Suppose we were to develop a code generator called vue-ncgen-demo-CLI. What would you guess?

Daniel: I guess, just one step.

Mr. Egg: that’s a bit much. I can’t do that. Bye

Daniel: Just kidding, dude, give it to me straight

Mr. Egg: Then walk in three steps

  • Step 1: Generate a code generator project
$ yarn create @ncgen/app # npm init @ncgen/app
Copy the code

  • Step 2: Write the code generator logic

Find ncgen-config.js in the generated project and modify the configuration file according to the logic of your code generator

Example configurations are here: github.com/daniel-dx/v…

Here’s a tip. When you need to add subcommands, you can do it more elegantly by using subcommands instead of copying and pasting

cd vue-ncgen-demo-cli
$ yarn create @ncgen/app add-sub # # npm init @ncgen/app add-sub
Copy the code

  • Step 3: Tell the world
$ npm run release
Copy the code

Daniel: Done?

Mr. Egg: Yes, it’s over. It’s as simple as that

Daniel: So how do my friends use this code generator?

Mr. Egg: Grey is often simple, the example goes up

# installation
$ npm i vue-ncgen-demo-cli -g

# Execute main command to generate scaffold project
$ vue-ncgen-demo-cli

Execute subcommand to insert code
$ vue-ncgen-demo-cli add-component
Copy the code

Daniel: Perfect, I can’t wait to develop my own code generator

Mr. Egg: I look forward to your feedback


Ncgen lot: github.com/daniel-dx/n… Please add a Star.

IO /ncgen/

Keywords: NCgen, scaffolding, Generator, code generator, scaffolding