借助Heroku的Oclif框架作为开发人员,我们经常会用到CLI工具。从git到cloud shells,我们处处都在使用这些工具。所以,是时候开发一个自己的了。在此过程中,我们将使用Heroku的强大的oclif框架。
Oclif是什么?
它是一个快速构建CLI工具的开放框架,由著名的Heroku提供。
要建什么?
我们将创建一个待办事项指令,它有四个操作:
1、添加新任
2、查看所有任务
3、更新任务
4、删除一个任务
初始化项目
Oclif可以生成两种类型的项目
1、具有一个命令的项目。
2、可能有多个命令(包括嵌套命令)的项目 。
在本文中,我们需要一个多命令项目,所以让我们生成它:
npx oclif multi todocli
运行此项指令并按照说明操作,将在当前目录中初始化一个名为todocli的新项目。
现在,让我们进入目录并运行帮助:
cd todocli && ./bin/run --help
这将给出如下结果:
> USAGE
$ todocli [COMMAND]
COMMANDS
hello
help display help for todocli
可用的指令及其文档将会被展示。
项目安排
在src目录中,我们可以找到一个名为commands的目录。这个目录包含所有指令及其相对文件名。打个比方,如果我们有一个hello指令,那么这个目录中有一个名为hello.js的文件,并且该指令将在无需任何设置的情况下运行。让我们删除hello.js,因为我们不需要它了。
设置数据库
为了存储我们的任务,我们需要一个存储系统。为了简单起见,我们将使用lowdb,这是一个非常简单的json文件存储系统。
然后我们来安装它吧:
npm install lowdb --save
让我们在项目根目录中创建一个db.json的文件。这个文件将保存我们的数据。然后我们需要安装lowdb。现在,我们将在src目录中创建一个名为db.js的文件。这个文件将保存数据库的内容。
在此,我们只是先加载所需的库和文件,然后将一个空的todos阵列定义为基本集合(如果是SQL数据库的话,那么它就是一个表格)。
添加任务
Oclif为我们提供了流畅的指令生成功能。让我们运行以下代码:
oclif command add
这将在src/commands目录中创建一个名为add.js的文件。让我们用下面的代码替换该文件的内容:
该文件有几个关键组件:
一个运行函数,执行此命令的主要功能的,
一项描述,这是指令的文件分类,
还有标志,它描述传递给指令的标志。
这里,我们有一个名为task的标志,它具有string类型。我们可以运行这个命令
./bin/run add --task="welcome task"
该指令将向数据库添加一个任务,并登载该操作的响应。
显示任务
在show.js中,我们以升序显示所有任务。我们在chalkjs中添加了一些颜色,以便更好地查看命令结果。
更新任务
为了简单起见,我们现在只是将更新部分的任务设置为done。我们只需要将任务的id当成flag。
./bin/run update --id=1
这会在这个任务里设置done = true以及id = 1。
删除任务
删除非常简单:我们将id作为标志传递,然后从数据库中删除相关任务。
快好了
就像这样,我们做了一个非常简单的todocli。现在,如果我们想像其他标准的CLI工具一样使用它,或者让我们的朋友使用它,我们需要使它成为一个npm包。我们要把它发布在npm上。
完成开发并发布到npm
首先,我们要有一个npm帐户。然后,我们需要登录运行指令。
npm login
然后在项目目录下运行
npm run prepack
这将打包该项目,并使其具备从描述和标志生成的自述文件并准备好发布。
现在,在npm上发布:
npm publish
如果一切顺利,那么该模块已成功发布在npm上。如果不能成功,请检查项目名称和版本。
我们可以开始使用它,像任何其他npm工具一样并支持全球安装:
npm install -g todocli
任何人都可以随时随地使用这些指令?
> todocli add --task="Great task!!!"
> todocli show
> todocli update --id=1
> todocli remove --id=1
如果您来到这里已经看完了整篇文章,恭喜?你真棒!
现在,你可以做一个小任务.
任务
分配任务的id是不正确,你可以修改吗?在回答部分告诉我你是怎么解的。
oclif : https://oclif.io
lowdb: https://github.com/typicode/lowdb
chalk: https://github.com/chalk/chalk
todocli: https://www.npmjs.com/package/todocli-frombd
今天的分享就到这里,希望本文能帮助到您!
点赞,让更多的人也能看到这篇内容(收藏不点赞,都是耍流氓 -_-)
关注公众号「新前端社区」,享受文章首发体验!
每周重点攻克一个前端技术难点。