重要性 | 包名称 | 功能 |
---|---|---|
必要 | minimist | 解析用户命令,将 process.argv 解析成对象 |
必要 | fs-extra | 对 fs 库的扩展,支持 promise |
必要 | chalk | 让你 console.log 出来的字带颜色,比如成功时的绿色字 |
必要 | import-from | 类似 require,但支持指定目录,让你可以跨工程目录进行 require,比如全局包想引用工程路径下的内容 |
必要 | resolve-from | 同上,只不过是 require.resolve |
必要 | inquirer | 询问用户并记录反馈结果,界面互动的神器 |
必要 | yeoman-environment | 【核心】用于执行一个「模板插件包」,后文详细描述 |
锦上添花 | easy-table | 类似 console.table,输出漂亮的表格 |
锦上添花 | ora | 提供 loading 菊花 |
锦上添花 | semver | 提供版本比较 |
锦上添花 | figlet | console.log出一个漂亮的大logo |
锦上添花 | cross-spawn | 跨平台的child_process (跨 Windows/Mac) |
锦上添花 | osenv | 跨平台的系统信息 |
锦上添花 | open | 跨平台打开 app,比如调试的时候开打 chrome |
5.2 命令解析与分发
命令的解析与分发,是「全局命令包」的核心功能,其过程比较简单。大家也可以直接看仓库cli-tpl (全部功能压缩到大约300行代码)
cli 版本更新判断:
先获取本 package.json 中的 version 再通过 npm view cli-tpl version 命令查询当前 npm 库最新版本 两者比较得出结论,提醒用户更新解析用户命令
通过 process.argv[2] 获取到用户执行的实际命令,比如 dcli install 可拿到 install (正式版推荐使用 minimist 解析参数)处理命令
比如 install 命令,则通过 require 动态映射 install.js 文件来处理该逻辑 注:require 支持动态名称,如 require('./scripts/' + command) 这样,如果 command 是 install 则映射执行 script/install.js 文件接下来我们看下 4 个核心命令,主要是:
命令 | 效果 |
---|---|
install | 帮用户安装/升级一个「模板插件包」 |
init | 帮用户初始化一个工程,并拷贝模板 |
build | 调用工程中的「构建插件包」,帮用户webpack构建 |
dev | 帮用户启动 devServer 进行调试 |
下面逐一阐述每个命令的实现过程以及效果:
5.3 install命令:安装一个「模板插件包」
install 意思就是把这个模板插件包下载到硬盘;此处我做了一个最小功能的 demo 包gen-tpl (后文详细分解) 来辅助讲解