创建一个属于自己的 cli 脚手架（未完成）

一、实现 “vue create <project-name>”

今天在输入vue create <project-name>的时候，想到一个问题，vue-create命令是怎么来的呢？为什么输入其它命令的时候会报错，但是输vue-create就可以正常执行呢？其实用npm link命令结合node的第三方模块command就可以实现命令全局注册。接下来说一下实现步骤：

1.用npm link实现命令全局注册

首先新建一个项目，在命令行输入'npm init -y'初始化项目生成package.json文件。接下来在package.json对象里写入bin属性，属性值为一个对象，如下：

{
  "name": "cli-test",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "bin": {
    "test": "./bin/www.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "axios": "^1.3.1",
    "commander": "^10.0.0",
    "inquirer": "^9.1.4",
    "ora": "^6.1.2"
  }
}

bin 中的 test 就是你想在全局注册的命令，相当于vue create命令中的vue,而后面的路径是你在输入该命令之后想要执行的脚本文件地址。这意味着你需要在package.json里按照此处的路径创建一个脚本文件，一般将该文件命名为 www.js 。

注意www.js文件在创建之后需要给第一行写入 #! /usr/bin/env node 这行代码意思是告诉系统会用 node 来执行这个文件，之后随便敲一行代码。如下：

#! /usr/bin/env node
console.log('test)

以上工作都就绪之后，此时在命令行里输入命令 npm link 来把 test 命令注册到全局。提示成功之后我们在全局任何路径下输入 test 变会执行 www.js 里的代码，如上图就是打印出 'test' 字符串。这意味着脚本与命令的映射关系已经建立。

至此，我们就注册了一个全局命令 'test'。

2.使用commander模块解析命令行参数

在我们注册了全局命令 test 之后，接下来可以使用 node 的第三方模块 commander 来解析命令行参数。

首先我们把 www.js 文件中的代码修改成如下图所示：

#! /usr/bin/env node
require('../src/main')

这意味着我们的主要逻辑代码需要写在外层 src 目录下的 main.js 里。

接下来我们在 man.js 里尝试打印一下 process.argv,运行 test create 会得到一个数组，数组的第三项代表的就是你输入的命令参数。

为什么这里要提到 process.argv 这个数组呢？因为接下来要用这个数组作为参数。

使用 npm i commander 安装依赖之后，我们在 main.js 中引入 commander 模块，命名为program ，接下来我们就可以输入下面的代码，来处理命令行参数 create 。如下：

 program.command('create').alias('c').description('创建一个测试项目').action(()=>{
     console.log('创建一个测试项目');
 })

图中 command 为接收的命令参数，相当于 vue create 中的 create , alias 为命令的简写，description 为项目的描述，action 传参的箭头函数代表输入该命令之后会执行的后续逻辑。

再在项目最后一行调用 program 的 version 方法和 parse 方法。其中，parse 方法是将命令参数传入 commander 管道中，他需要接收上文中提到的 process.argv 参数，一般放在最后执行，如下：

program.version('1.0.0').parse(process.argv)

做到这一步，我们在命令行里输入test create 就会出现 “创建一个测试项目” 这句话。

另外，我们在输入以上代码之后 commander 包就已经内置了两个命令的参数解析。即 -V(Version)和 -h(help),分别代表的是包的版本号和帮助文案。

好了，这就是这期文档的全部内容了，下期会更新拉取模板的代码逻辑和简单的项目结构。Bye