使用typescript快速开发一个cli的实现示例
作者:Jason Long 发布时间:2023-08-30 07:25:25
cli 的全称 command-line interface(命令行界面),也就是前端同学常用的脚手架,比如 yo、vue cli、react cli 等。
cli 可以方便我们快速创建项目,下图是引用 vue cli 的介绍:
创建项目
运行下面的命令,创建一个项目:
npm init
执行命令完成后,可以看到项目根目录只有一个 package.json 文件。
在 package.json 文件增加 bin 对象,并指定入口文件 dist/index.js。
在命令行运行需要在入口文件的第一行增加 #!/usr/bin/env node
,告诉系统用 node 运行这个文件。
{
"name": "cli-demo",
"version": "0.0.1",
"description": "cli demo",
"keywords": [
"cli"
],
"bin": {
"cli-demo": "dist/index.js"
}
...
}
安装依赖
命令行工具,也会涉及到用户交互的动作,那么 node.js 是怎么实现呢?早有大佬提供了非常好的库,我们只要拿过来用,主要有两个库:
commander:完整的 node.js 命令行解决方案。
inquirer:交互式命令行工具。
将这两个库安装到项目里:
yarn add commander inquirer
由于是用 typescript 开发,再通过 rollup 打包,先安装相关的依赖库:
yarn add typescript rollup rollup-plugin-terser rollup-plugin-typescript2 @types/inquirer -D
配置
由于是用 typescript 开发,首先需要配置一下 tsconfig.json。
{
"compilerOptions": {
"target": "ES6",
"module": "ESNext",
"sourceMap": false,
"declaration": false,
"outDir": "./dist",
"moduleResolution": "Node",
"esModuleInterop": true,
"resolveJsonModule": true,
"removeComments": false,
"importHelpers": true,
"strict": true,
"lib": ["ES6", "DOM"]
},
"include": ["src"]
}
接下来在根目录增加一个 rollup.config.js,把 typescript 代码编译成 javascript 代码。前面提到的要在第一行增加 #!/usr/bin/env node
来告诉系统用 node 运行,那么可以在 rollup.config.js 的 banner
选项,把 #!/usr/bin/env node
写在最前面。
import typescript from 'typescript'
import json from '@rollup/plugin-json'
import { terser } from 'rollup-plugin-terser'
import typescript2 from 'rollup-plugin-typescript2'
import { dependencies } from './package.json'
const external = Object.keys(dependencies || '')
const globals = external.reduce((prev, current) => {
const newPrev = prev
newPrev[current] = current
return newPrev
}, {})
const defaultConfig = {
input: './src/index.ts',
output: {
file: './dist/index.js',
format: 'cjs',
banner: '#!/usr/bin/env node',
globals
},
external,
plugins: [
typescript2({
exclude: 'node_modules/**',
useTsconfigDeclarationDir: true,
typescript,
tsconfig: './tsconfig.json'
}),
json(),
terser()
]
}
export default defaultConfig
实现一个简单的 cli
在根目录创建一个 src
文件夹,然后再创建一个 index.ts
。
添加引用
添加引用并实例化 Command
对象。
import { Command } from 'commander'
import pkg from '../package.json'
const program = new Command(pkg.name)
自定义命令
实现一个可交互的自定义命令,模拟在终端(命令行)的登录功能。使用 command
方法创建一个命令,description
可以用来描述这个命令的作用,登录处理逻辑则写在 action
方法里。最后使用 parse(process.argv)
方法,解析命令。更多详细介绍和使用,可移步:https://github.com/tj/commander.js/blob/master/Readme_zh-CN.md。
program
.command('login')
.description('模拟登录。')
.action(() => {
handleLogin()
})
program.parse(process.argv)
交互的话,用到前面说的 inquirer
库,接收输入的用户名和密码。选项的 type
的值有 input
、password
、number
、checkbox
、editor
、list
、rawList
、expand
、confirm
,选项 name
是 inquirer.prompt
方法返回的对象,选项 validate
可用来验证输入是否符合规则。更多详细介绍和使用,可移步:https://github.com/SBoudrias/Inquirer.js/blob/master/README.md
如果选项 type
是 password
,可通过 mask
设置掩码。
const handleLogin = () => {
// 配置交互的用户名和密码
const prompt = [
{
type: 'input',
name: 'userName',
message: '用户名:',
validate: (value: string) => value.length > 0 || '用户名不能为空'
},
{
type: 'password',
name: 'password',
message: '密码:',
mask: '🙈 ',
validate: (value: string) => value.length > 0 || '密码不能为空'
}
]
inquirer.prompt(prompt).then(({ userName, password }) => {
if (userName === 'demo' || password === '123456') {
console.log('登录成功')
return
}
console.log('用户名或密码错误')
})
}
其他
一个 cli 工具,帮助信息也是必须的,可以通过 on('--help')
修改自定义帮助信息。
必须在 parse
方法之前。
program.on('--help', () => {
console.log('\n运行 cli-demo -h | --help 查看命令使用。\n')
})
然后再来修改一下,没有输入任何参数的时候,会出现错误,可以使用 exitOverride
方法重新退出,在终端(命令行)输出帮助信息。
program.exitOverride()
try {
program.parse(process.argv)
} catch (error) {
program.outputHelp()
}
到这里,一个简单的 cli 工具完成了,先本地来测试下看看。在终端(命令行)输入 npm link
,生成一个全局软连接,可以方便调试和测试。
来源:https://www.cnblogs.com/JasonLong/p/14075724.html
猜你喜欢
- 我们通常所说的DML、DDL、DCL语句都是sql*plus语句,它们执行完后,都可以保存在一个被称为sql buffer的内存区域中,并且
- PHP ZipArchive 是PHP自带的扩展类,可以轻松实现ZIP文件的压缩和解压,使用前首先要确保PHP ZIP 扩展已经开启,具体开
- 概要:Oracle关系数据库系统以其卓越的性能获得了广泛的应用,而保证数据库的安全性是数据库管理工作的重要内容。本文是笔者在总结Oracle
- 欣赏上一篇:用画为5.12地震受灾同胞们祈福 今年我们的祖国多灾多难 雪灾的阴影还没散去又发生了地震。中国插画 * 举办5.12地震祈幅绘画活
- 最近论坛里总有人问幻灯片怎么从数据库里取数据,花了几分钟简单的写了下。用到的人可以自己在细化<%dim rs,sqlset&
- 阻塞定义当来自应用程序的第一个连接控制锁而第二个连接需要相冲突的锁类型时,将发生阻塞。其结果是强制第二个连接等待,而在第一个连接上阻塞。不管
- 代码如下:set fso=server.createobject("scripting.filesystemobject"
- 用过QQ的人应该都知道软键盘,他可以增强我们密码的安全性,以保证我们的密码资料不被非法监听。现在软键盘也用在了很多的网站上,像早期银行的在线
- 你已经在上面取出w打头记录的例子中看到了LIKE的用法。LIKE判定词是一个非常有用的符号。不过,在很多情况下用了它可能会带给你太多的数据,
- 看代码吧~package mainimport ("fmt""io""net/http&q
- 本文实例讲述了javascript设计模式 – 简单工厂模式。分享给大家供大家参考,具体如下:介绍:简单工厂模式是最常用的一类创建型设计模式
- scriptlet的使用jsp页面中分三种scriptlet:第一种:<% %> 可以在里面写java的代码。定义java变量以
- 如何用HtmlEncode来显示Unicode? 见下:<%@ Language=VBS
- 以下的文章主要向大家介绍的是实现MySQL远程访问的实际操作流程,以及在实现MySQL远程访问的过程中哪些的相关事项是十分重要的,以下就是文
- 图像噪声是指存在于图像数据中的不必要的或多余的干扰信息。在噪声的概念中,通常采用信噪比(Signal-Noise Rate, S
- 这是我在做的一个游戏的半成品,整理了一下发出来.原理:通过更新变换矩阵来记录转动(函数remx()).利用矩阵计算出转动后的正方体顶点坐标,
- 本文实例为大家分享了Golang实现文件传输的具体代码,供大家参考,具体内容如下借助TCP完成文件的传输,基本思路如下:1、发送方(客户端)
- 公司做了个客户,需要图片生成像alibaba的效果。原来开发的系统都是用Aspjpeg进行缩小图的,现在需要处理图片,当然又想到这个组件。但
- 与Channel区别Channel能够很好的帮助我们控制并发,但是在开发习惯上与显示的表达不太相同,所以在Go语言中可以利用sync包中的W
- 昨天给公司服务器重做了一下系统,遇到Asp附件无法上传,之前服务器上使用好好的,怎么重做了就不正常了,于是一番google,baidu,下面