脚手架学习
1、为什么全局安装 @vue/cli 后,执行 vue create xxx 命令就能运行?
npm 会将包安装在全局 node_modules 目录中,执行命令时,系统会在 PATH 环境变量列出的目录中查找 vue
可执行文件,这个文件通常位于 @vue/cli/bin/vue.js
@vue/cli 包的 package.json 中定义了安装时能自动创建命令的链接
"bin": {"vue": "bin/vue.js"
}
2、执行 vue 命令时发生了什么?为什么 vue 指向一个 js 文件,但 我们却可以通过 vue 命令去执行它?
1、终端首先会在系统的 PATH
环境变量中查找名为 vue
的可执行文件,通过 where vue
命令可以看到;
2、 js 文件能够直接执行是因为文件顶部有 shebang 声明,告诉系统用 node 解释器来执行此脚本
#!/usr/bin/env node
3、当通过 npm 全局安装 @vue/cli
时,npm 会做两件事:1、将包安装到全局 node_modules;
2、在系统的 bin 目录创建软链接指向这个 js 文件
3、脚手架开发流程
创建 npm 项目,创建脚手架入口文件,最上方添加:
#!/usr/bin/env node
配置 package.json,添加 bin 属性
编写脚手架代码,将脚手架发布到 npm
4、脚手架开发难点
1、如何将脚手架的逻辑会拆分为若干个简单的模块
2、如何注册命令,并将注册的命令执行到对应的方法上:vue create、vue add、vue invoke
3、如何设计参数解析( vue command [options] <params>)、帮助文档、命令行交互、日志打印、命令行文字变色、网络通信、文件处理等
、