After the VUE-CLI is installed, the Vue command and Vue init, vue list, Vue build three subcommands are provided, and the Vue.js-based scaffolding project can be built by command. This article provides a brief description of how these commands are implemented.
Project directory for VUE-CLI
As described in the previous article, during the NPM installation process, you can use the configuration of the Bin field in Package.json to soft-connect the command file under the Bin directory to the global command. This means that four soft-connect commands are generated under/usr/local/bin: Vue, Vue-build, Vue-list, Vue-init.
The source of Vue command
#!/usr/bin/env Noderequire (' Commander ') . Version (Require ('. /package '). Version). usage (' <command> [Options] '). command (' init ', ' Generate a new project from a Template ') . Command (' list ', ' list available official templates ') . Command (' Build ', ' prototype a new project ') C5/>.parse (PROCESS.ARGV)
This command is implemented using Commander.js. The main methods of Commander are:
(1) Parse: For parsing process.argv, assigning Process.argv.slice (2) to Program.args;
(2) command: To create subcommands, subcommands are used by command <subcommand> [options], the actual call is Command-subcommand, such as using the command line to perform Vue list, is actually executing the vue-list global command;
(3) Options: The main setting of the parameters of the command, while providing a description of the parameter corresponding document, the default option is--help.
Implementation of Vue-init Sub-command
The main function of Vue-init is to pull the project template file (official or homemade) under the specified git directory into the specified directory, using the following
$ vue init <template-name> <project-name>
There is still a need to parse the PROCESS.ARGV, so the commander.js is introduced in Vue-init, which generates a program
Program . Usage (' <template-name> [Project-name] ') . Option ('--offline ', ' Use Cached template ')/** * Help . */function Help () { program.parse (PROCESS.ARGV) if (Program.args.length < 1) return Program.help ()}help ()
Next is to implement the pull template file, after processing, placed in the output directory, how to achieve, then there will be a special article about the implementation of the VUE-CLI command principle, please look forward to!
How to write command tools using node. JS--Take vue-cli as an example