以 vue-cli 为例
脚手架简介
脚手架是一个操作系统的客户端。
vue create my-app --force
-
主命令:vue
-
command:create
-
command 的 params :my-app
-
这里的 --force 叫 options, 可以理解为用来辅助脚手架确认在特定情况下用户的选择。
脚手架的执行原理
-
在终端输入命令:vue xxx
-
终端解析出 vue 命令
-
终端在环境变量中找到 vue 命令
-
终端根据 vue 命令链接到实际的 vue.js 文件
-
终端使用 node 执行 vue.js
-
vue.js 解析 command/options
-
vue.js 执行 command
-
执行完成,退出执行
脚手架工具:lerna
lerna 是一个优化基于 git + npm 的多 packages 的项目管理工具。
yargs
Yargs 框架通过使用 Node.js 构建功能全面的命令行应用,它能轻松配置命令,解析多个参数,并设置快捷方式等,还能自动生成帮助菜单。
yargs 入门使用,常用api
#!/usr/bin/env node
const yargs = require('yargs/yargs')
const dedent = require('dedent') // 清楚文本顶格空格
const pkg = require('../package.json')
const argv = process.argv.slice(2)
const cli = yargs()
const context = {
longerVersion: pkg.version
}
cli
.usage('longer [command] <options>') // 顶部会打印出输入的提示
.demandCommand(1, '最少输入一个 command 命令') // 最少输入 command 命令数量
.alias('h', 'help') // 别名
.alias('v', 'version')
.strict() // 严格模式 输入错误信息会有反馈提示
.recommendCommands() // 如果输错命令 会去注册的命令里找一条最相近的给一条提示 (Did you mean list?)
.fail((err, msg) => {
console.log('err:', err)
}) // 命令错误处理
.wrap(cli.terminalWidth()) // 设置命令行宽度 terminalWidth 返回当前命令行宽度
.epilogue(dedent` 这是自定义页脚的一句话`) // 自定义页脚 !! ES6里面 模板字符串函数调用传参可以不加括号 具体参考阮一峰ES6教程 -字符串扩展-模板字符串-7模板标签
.options({
debug: {
type: 'boolean',
describe: '开启 debug 模式',
alias: 'd'
}
}) // 添加多个全局选项 具体配置参数参考文档
.option('registry', {
type: 'boolean',
// hidden: true,
describe: '全局的仓库地址',
alias: 'r'
}) // 添加单个全局选项
.group(['debug'], '开发命令:') // 添加选项分组
.group(['registry'], '安装命令:') // 添加选项分组
.command('init [name]', '初始化项目', (yargs) => {
yargs.option('name', {
type: 'string',
describe: '初始化项目名称',
alias: 'n'
}
)}, (argv) => {
console.log(argv)
}) // command 命令注册 第一种方式
.command({
command: 'list',
aliases: ['ll', 'ls', 'la'],
describe: '获取列表',
builder: (yargs) => {},
handler: (argv) => {
console.log(argv)
}
}) // command 注册命令的第二种 传入一个对象配置
.parse(argv, context) // 解析 argv 参数, 并且可以往 argv 里拼接参数