什么是脚手架

脚手架本质是一个操作系统的客户端【本质是node是一个客户端】，它通过命令执行，比如：

vue create vue-test-app

上面这条命令由3个部分组成：

主命令：vue
command： cretae
command的参数：vue-test-app

它表示创建一个vue项目，项目的名称vue-test-app，上面是一个较为简单的脚手架命令，但实际场景更加复杂，比如：当前目录已经有文件了，我们需要覆盖当前目录下的文件，强制进行安装vue的项目，此时就可输入：

vue create vue-test-app --force

这里的--force做option，用来辅助脚手架确认在特定场景下用户的选择（可以理解为配置）。还有一种场景：通过vue create创建项目时，会自动执行npm install帮用户安装依赖，如果我们希望使用淘宝源来安装，可以输入命令：

vue create vue-test-app --force -r https://registry.npm.taobao.org

这里的-r也叫做option，它与--force不同的是它使用-，并且使用简写，这里的-r也可以替换成--registry，这个简写可以通过如下命令就可以看到vue create支持的所有iptions

vue create --help

-r https://registry.npm.taobao.org的https://registry.npm.taobao.org是option的参数，其实--force可以理解为：--force true,简写为--force或-f

脚手架的执行原理

前置知识：在环境变量中找到vue指令的方法是在终端输入which vue;其中which是Linux系统下可以查找命令的绝对路径，windows系统下没有这个命令，可以使用where代替上面例子脚手架的执行原理如下：

在终端输入vue create vue-test-app
终端解析出vue命令
终端在环境变量中找到vue环境变量
终端根据vue命令链接到实际的文件vue.js
终端利用node执行vue.js
vue.js解析command/options
vue.js指定command
执行完毕，退出执行

为什么全局安装`@vue/cli`后会添加命令`vue`

正常安装的是npm install -g @vue/cli,正常情况下安装的是vue/cli，为什么命令不是vue/cli；在控制台输入which vue可以得到一个路径，一般这个路径指的是node文件下的bin目录，bin表示可执行文件，全局安装的可执行文件都会放在这里；进入该路径，执行ls -la可以看到vue命令是一个软链接，指向本地安装路径；即vue本质的真实文件是vue.js，可以看到这里面的package文件下的bin配置为vue，所以命令为vue。

$ which vue 
 
$ cd /usr/local/bin
$ ls -la

lrwxr-xr-x   1 admin  admin    62  9  2 19:44 vue -> ../../../Users/admin/.config/yarn/global/node_modules/.bin/vue

故一般命令都是根据package文件下的bin配置来生成

全局安装@vue/cli会发生什么？

会先去下载依赖@vue/cli指定的node的bin的node_module里面，然后回去配置bin下面对应的软链接。

#!/usr/bin/env node [在文件的开头可以看到这样一行代码。用于指明该脚本文件要使用node来执行]该行文件的意思是在环境变量中查找到node这个变量，其实也可以写死，但是写死就不灵活了，每个人配置的环境变量路径不一样

node -e"console.log('hello world)"
//会输出"hello world"

脚手架开发流程

1.创建npm项目 2. 创建脚手架入口文件，最上方添加：#!usr/bin/env node 3. 配置package.json添加bin属性 4. 编写脚手架代码 5. 将脚手架发布到npm

开发难点

分包：如何将复杂的系统拆分成若干个模块
命令注册：
- vue create
- vue add
- vueinvoke
参数解析：vue command [options]（可以使用node的默认库process，const argv=require('process').argv,其中command=argv[2]）
options的全程
options的简写
带params的options
帮助文档
命令行打印
日志打印等

脚手架本地调试方式

1、npm link进行软链
2、或者全局安装该包，会软链接到源码目录
链接本地脚手架
cd your-cli-dir
npm link

链接本地库文件
cd your-lib-dir
npm link
cd your-cli-dir
npm link your-lib

取消链接本地库文件
```
cd your-lib-dir
npm unlink
cd your-cli-dir
# link存在
npm unlink your-lib
# link不存在
rm -rf node_modules
npm install -S your-lib
```

理解npm link： npm link your-lib:将当前项目中node_modules下指定的库文件链接到node全局node_modules下的库文件； npm link:将当前项目链接到node全局node_modules中作为一个库文件，并解析bin配置创建可执行文件 npm unlink：将当前项目从node全局node_modules中移除 npm unlink your-lib：将当前项目中的库文件依赖移除

脚手架原理