开发背景
博客很久没有更新了， 今天更新一个好玩的，等我将vue3的东西彻底搞明白我会更新一个vue3的系列，到时候会更新稍微勤一点，在使用vuecli的时候发现他的脚手架很有意思，用了几年了，但是一直没有好好研究过这个东西是怎么实现的，所以今天就好好的记录一下这玩意怎么实现的，记录的过程中有什么注意事项我也会标明的，当然我会尽可能的写的明白一些，因为这个东西有一些地方不那么好理解，当一个东西不太好理解的时候文章书写的顺序就显的很重要，因为开始的时候如果你就很迷茫，那么你看下去的看动力也就没有了，所以我也是尽可能的从最简单的开始写，相信只要按照文章一点点的来，应该都是没问题的，我文章的顺序就是我自己开发这个功能的顺序，如果有大神觉得我哪里写的有什么问题的话，也可以下方留言，我看到了都会补充说明并表示感谢。文章看起来觉得比较费劲的可以直接移步我的github，源码奉上 源码
先看效果：
实现过程中可能存在的问题
- 如何获取用户的输入
- 如果根据用户的输入进行相应的操作
- 如何自定一个packag.json文件
- 如何发布到npm
初始化一个package.json
代码语言：javascript复制npm init 或者 npm init -y初始化一个测试文件
代码语言：javascript复制#!/usr/bin/env node
console.log("function is success")特殊说明： #!/usr/bin/env node 这里是必须要加的，如果你实在不理解，那么你可以先这样写，另外就是这行代码必须是第一行，他的前面不可以有任何代码 当然这里也可以解释一下，你可以简单的理解为增加这一行是为了指定用node执行脚本文件。如果想深入理解这个东西，可以看一下大神的介绍Shebang 希望可以有点帮助
运行该文件
代码语言：javascript复制node index.js将node index.js 替换为自定义命令
比如：wlm
我们的目的是，当我们输入 wlm的时候 执行的是node index.js这句话即可
配置package.json
代码语言：javascript复制{
"name": "wlm-cli",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo "Error: no test specified" && exit 1"
},
"author": "",
"license": "ISC",
"bin": {
"wlm":"index.mjs"
}
}bin命令 说明
“bin”: { “wlm”:“index.js” } 这里的bin就是我们需要使用的终端命令，后面的文件就是我们指定的mjs文件，当然这个文件你可以自己封装，只要是一个入口文件就可以，vue-cli源码这里指向的就是一个bin文件
发布该命令
代码语言：javascript复制npm link // 将bin脚本下的命令进行发布到本地，本地就可以使用bin脚本中的命令效果
代码语言：javascript复制wlm
function is success注意事项
需要被执行的文件需要使用#!/usr/bin/env node 进行声明 否则是不生效的，该命令是映射到全局的，所以你在任何地方都是可以直接进行使用该命令的，就和你使用vue-cli是一样的效果
移除link
代码语言：javascript复制npm unlink // 注意这里必须在项目文件中执行，不可以全局执行 实现过程
脚本命令参数设计
代码语言：javascript复制wlm --help 查看使用帮助
wlm -V |--version 查看工具版本号
wlm list 列出所有可用模板
wlm inti <template-name> <project-name> 基于制定模板进行项目初始化 <> 代表的是必填项下面的操作都是服务于上面
