cli 脚手架简单实现
npm-link 命令与package.json bin组合 -- 全局命令
在工具包没有publish到远程时,可以用npm link
,链接到本地全局,可用对应的命令执行js脚本,一般用于调试本地的包。
例子:
在package.json
加入配置
"bin": {
"my-cli-demo": "bin/index.js"
},
在项目根目录命令行npm link
再执行 my-cli-demo
即可运行bin/index.js
脚本,类似于vue-cli的vue create project-name
在bin/index.js文件第一行需要加上
#!/usr/bin/env node
备注该文件是可执行文件如:
#!/usr/bin/env node const commander = require("commander");
如果工具已经调试完成并publish到远程仓库,需要用 npm unlink <package> -g
注销,再用 npm install <package> -g
全局安装远程的工具包。
commander与inquirer组合 -- 交互式命令行
commander
的作用是定义命令、选项、帮助和业务逻辑,类似于vue create <project-name>
, vue执行对应的文件,create <project>
执行对应的处理函数
如以下代码:当在命令行执行 my-cli-demo init/i
时,会进入对应action
回调里,更多参数选择commander.js文档
#!/usr/bin/env node
const commander = require("commander");
commander
.command("init") // 命令
.alias("i") // 命令别名
.description("初始化一个项目") // 命令描述
.action(function () {
});
inquirer
的作用是提供命令行的交互,获取用户的选择参数,进行下一步的操作。更多选项类型参考Inquirer.js文档
如以下代码:
#!/usr/bin/env node
const commander = require("commander");
const inquirer = require("inquirer");
commander
.command("init") // 命令
.alias("i") // 命令别名
.description("初始化一个项目") // 命令描述
.action(function () {
//初始化参数
const promptInit = [
{
type: "input",
message: "输入项目名称:",
name: "name",
default: "MyProject",
},
{
type: "list",
message: "选择项目类型:",
name: "type",
choices: ["demo-type-1", "demo-type-2"],
},
];
inquirer.prompt(promptInit).then((answers) => {
console.log(answers) // answers = {name: 'pro', type: 'demo-type-2'}
// ...do something
})
});
这就是CLI脚手架的简单实现,可以以此为基础不断壮大脚手架