前言
在前端开发中,拥有一套高效、简洁、适合自己的前端项目构建工具是非常有必要的。毕竟市面上不是所有的工具都能满足自己复杂工作的需要。此外也希望可以将此技术服务于其他的伙伴们。
本文分为几个章节,本章节讲述cli基础功能,从初始化项目到clone远端模板的流程。敬请期待其他章节
搭建CLI准备
每一次成功,我们都是站在巨人的肩膀上。
- 首先简单介绍几个常用的依赖的包
commander:命令行接口的完整解决方案,设置一些node命令,如help、usage、version、parse输入的参数。
download-git-repo:git代码下载库,存到本地。
chalk: node终端样式库,可以修改console的输出颜色。
inquirer: 用户与命令行之间的交互问答工具。
ora:终端旋转器,loading小圈圈。
rimraf:删除文件。
初始化项目
- 创建项目文件夹,执行以下命令,创建项目package.json。
$ npm init
初始化结果
{
"name": "cli",
"version": "1.0.0",
"description": "0基础教你开发自己的CLI",
"main": "main.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [
"cli"
],
"author": "猿话",
"license": "ISC"
}
编辑项目
- 修改package.json文件,添加bin中的CLI将是我们执行的命令,和依赖库。
{
"name": "cli",
"version": "1.0.0",
"description": "0基础教你开发自己的CLI",
"main": "main.js",
"bin": {
"CLI": "./bin/cli"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"dependencies": {
"inquirer": "^4.0.0",
"ora": "^1.3.0",
"rimraf": "^2.6.2",
"chalk": "^2.3.0",
"commander": "^2.11.0",
"download-git-repo": "^1.0.1"
},
"keywords": [
"cli"
],
"author": "猿话",
"license": "ISC"
}
- 新增bin/cli目录文件,编写bin/cli文件。
首先我们先编写一个输出cli版本号的命令
#!/usr/bin/env node
//第一行其中#!/usr/bin/env node表示用node解析器执行本文件。
const program = require('commander')
const pkg = require('../package')
const chalk = require('chalk')
const download = require('download-git-repo');
const ora = require('ora');
const spinner = ora('Loading undead unicorns');
/**
* version
*/
program
.version(chalk.green(`${pkg.version}`))
/**
* init 项目
*/
program
.command('init ')
.description('generate a project from a remote template (legacy API, requires ./wk-init)')
.option('-c, --clone', 'Use git clone when fetching remote template')
.action((template, appName, cmd) => {
spinner.start('开始下载');
download('direct:https://github.com/study-demo/cli-demo.git', appName, { clone: true }, err => {
if (err) {
spinner.fail(chalk.green('下载失败 \n' + err));
process.exit();
}
spinner.succeed(chalk.green(`下载成功`));
});
})
program.parse(process.argv)
到此一个简单的cli就搭建完成。
本地调试
- 本地安装
npm install -g
OR
npm link // 添加软连接
- 调试
// 查看版本号
CLI -V
OR
node bin/cli -V
// 初始化项目
CLI init
OR
node bin/cli init
发布到npm
npm login
npm publish
详细信息参考:《一分钟教你发布npm包》