命令行工具的开发应该是每个前端工程师必备的技能,但是有很多同学刚开始学习时不知道如何入手,今天就来简单介绍一下如何用commander来开发命令行工具。
初始化
-
首先cd进入某个文件夹,运行npm init,根据提示信息来生成package.json文件;
-
之后在同级目录下创建bin/test1.js文件;
-
接着在package.json中增加bin字段:
"bin": { "test1": "./bin/test1.js" },
我们在写命令行工具的时候,需要指定一个可执行文件。在package.json中,bin字段用来映射命令名和可执行文件。在通过npm install -g全局安装的时候,npm会symlink可执行文件到prefix/bin文件夹。如果通过npm install本地安装的时候, npm会symlink可执行文件到./node_modules/.bin/文件夹。(完整的字段说明在这里:https://docs.npmjs.com/files/package.json)
-
之后开始编写test1.js文件
#! /usr/bin/env node //选择用什么来运行脚本
var program = require('commander'),
chalk = require('chalk'),
path = require('path'),
fs = require('fs'),
inquirer = require('inquirer');
program
.version(require('../package').version)
.description('a test commander program')
.option('-n --name <name>', 'your name')
.option('-a --age <age>', 'your age')
.option('-e --enjoy [enjoy]');
program
.command('add [dir]')
.option('-s --select', 'select answer')
.on('--help', () => {
console.log('开始创建文件')
}) //on像是某些option的说明
.action((dir, cmd) => {
if(cmd.select){
console.log('start select mode');
// inquirer 交互式命令时使用
inquirer.prompt({
type: 'input',
name: 'email',
message: '请输入邮箱'
}).then((res) => {
// chalk为输出的文字加状态,如颜色、字体等
console.log(chalk.red(res.email));
// process.cwd()获取当前路径
var filePath = path.join(process.cwd(), dir || 'common');
fs.exists(filePath, (exists) => {
console.log('文件是否存在', chalk.yellow(exists));
if(!exists)
fs.mkdir(filePath, (err) => {
if(err) console.log('err', err);
});
else
fs.rmdirSync(filePath);
});
});
}
});
program.parse(process.argv);
调试
当我们在开发命令行工具时不可能每次修改的时候都传到服务器上去重新下载更新检测,故这里我们使用npm link方法;
在npm包文件夹下执行npm link 命令,会创建一个符号链接,链接全局文件夹{prefix}/lib/node_modules/和你执行npm link的包文件夹。
注意:package-name是package.json中的name, 而不是文件夹名。
详细的解释在这儿: https://docs.npmjs.com/cli/link
在本文中,我们在根目录下使用npm link,之后根目录下创建/src文件夹来进行测试;
cd src/
test1 -h
Usage: test1 [options] [command]
a test commander program
Options:
-V, --version output the version number
-n --name <name> your name
-a --age <age> your age
-e --enjoy [enjoy]
-h, --help output usage information
Commands:
add [options] [dir]
test1 add '/image' -s //增加交互式消息,并且成功输入之后在src文件夹下创建image文件夹
发布
单纯的发布包到npm非常简单,只需要一条命令:
npm publish
但是一个完善规范的发布流程不仅如此,还需要考虑版本号的规范(Semver),commit message的规范,tag等一系列因素。如果手动来搞的话,是挺麻烦的。
这里推荐使用relix, 一步搞定!
sudo npm i relix -g
进入cli-demo文件夹,然后:
relix --patch
会自动帮你生成新版本号,生成提交信息,打tag,推送提交和tag到github,发布npm包!relix的详细用法请看relix文档。