inquirer.js——交互式命令行用户界面

2023-11-02 20:12

本文主要是介绍inquirer.js——交互式命令行用户界面,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

一、什么是inquirer.js

1、inquirer.js是一个开源的交互式命令行用户界面(CLI)库,可以让你轻松地与用户进行交互,获取用户输入并做出相应的处理。它的主要功能是提供了一系列常用的命令行交互界面组件,例如input、confirm、list、checkbox等。

2、inquirer.js 是一个 Node.js 模块,因此可以轻松与Node.js应用程序集成。 使用 inquirer.js,您可以创建复杂的交互式命令行用户界面,从而使您的命令行应用程序更加易于使用和人性化。

3、inquirer.js 还可以通过采用合适的可扩展性接口来创建自定义函数,这些自定义函数可以作为 inquirer.js 的插件来使用。

二、如何使用inquirer.js

使用 inquirer.js 时,您需要首先在项目中安装它,具体步骤如下:

npm install inquirer

在 Node.js 应用程序中,可以使用以下代码示例来创建一个简单的命令行提示:

// 引入inquirer.js
const inquirer = require('inquirer');// 从用户中获取姓名
inquirer.prompt([{type: 'input',name: 'name',message: '请输入你的名字:'}
]).then(answers => {console.log(`你好,${answers.name}!`);
});

在运行上述代码后,它将提示您输入您的名字,并在控制台上输出“你好,你的名字!”消息。

这里请注意 Inquirer v9及更高版本是 native esm 模块,这意味着您不能再使用 commonjs 语法require,如果还要使用 require 需要低版本的 Inquirer.js
npm install --save inquirer@^8.0.0

新版本的引入方法:

import inquirer from 'inquirer';inquirer.prompt([/* Pass your questions in here */]).then((answers) => {// Use user feedback for... whatever!!}).catch((error) => {if (error.isTtyError) {// Prompt couldn't be rendered in the current environment} else {// Something else went wrong}});

直接使用会报错
在这里插入图片描述
错误:加载ES模块,设置"type": “module” 在packahejson中或使用.mjs文件
其实在错误提醒中已经写了解决方法,就是在 package.json中加入 “type”: “module” 即可。

三、inquirer.js的使用场景

inquirer.js 很适合用于开发命令行工具时的用户输入场景。使用 inquirer.js,您可以轻松地与终端用户进行交互,使您的命令行工具更加人性化。以下是 inquirer.js 常见的使用场景:

1、配置选项交互
使用inquirer.js,您可以配置选项交互进行交互,让用户轻松地设置或更改您命令行工具的选项。

inquirer.prompt([{type: 'input',name: 'username',message: '请输入您的用户名:',},{type: 'password',message: '请输入您的密码:',name: 'password',},{type: 'list',message: '请选择您的语言:',name: 'language',choices: ['中文', '英语']},
]).then(answers => {console.log('您的用户名是:', answers.username);console.log('您的密码是:', answers.password);console.log('您选择的语言是:', answers.language);
});

2、多项选择交互
使用inquirer.js,您可以轻松地创建多项选择交互,让用户从预定义的一系列选项中进行选择。

inquirer.prompt([{type: 'list',message: '请选择您想安装的应用程序?',name: 'app',choices: [{name: 'Google Chrome',value: 'chrome'},{name: 'Visual Studio Code',value: 'vscode'},{name: 'Adobe Photoshop',value: 'photoshop'}],},{type: 'confirm',message: '您确定要安装吗?',name: 'confirm',},
]).then(answers => {if (answers.confirm) {console.log(`您选择的应用程序是:${answers.app}`);} else {console.log('已取消安装!');}
});

3、命令行交互
使用inquirer.js,您可以创建交互式命令行界面,让用户可以以类似于运行命令的方式与您的应用程序进行交互。

inquirer.prompt([{type: 'command',message: '请输入要执行的命令:',name: 'command',},
]).then(answers => {console.log(`执行命令:${answers.command}`);
});

四、inquirer.js的组件

inquirer.js 提供了多种交互式命令行界面组件,包括:

1、input
对用户输入的字符串进行回答。

inquirer.prompt([{type: 'input',name: 'name',message: '请输入您的姓名:'}
]).then(answers => {console.log(`您好,${answers.name}!`);
});

2、confirm
一个简单的是/否交互,返回Boolean类型的值。

inquirer.prompt([{type: 'confirm',name: 'truth',message: '宇宙真的无限大吗?',}
]).then(answers => {if (answers.truth) {console.log('正确!');} else {console.log('错误!');}
});

3、list
从一个列表中选择一项。

inquirer.prompt([{type: 'list',name: 'color',message: '选择一个颜色:',choices: ['红色', '绿色', '蓝色'],}
]).then(answers => {console.log(`您选择的颜色是:${answers.color}`);
});

4、rawlist
类似于 list,但是与用户的选择是不相关的。

inquirer.prompt([{type: 'rawlist',name: 'pet',message: '您最喜欢的宠物是什么?',choices: ['狗', '猫', '兔子'],}
]).then(answers => {console.log(`您最喜欢的宠物是:${answers.pet}`);
});

5、checkbox
从一个复选框列表中选择多个选项。

inquirer.prompt([{type: 'checkbox',name: 'fruits',message: '选择您最喜欢的水果:',choices: [{name: '苹果', value: 'apple'},{name: '香蕉', value: 'banana'},{name: '草莓', value: 'strawberry'},{name: '桃子', value: 'peach'},],}
]).then(answers => {console.log(`您选择的水果是:${answers.fruits}`);
});

6、password
密码输入

inquirer.prompt([{type: 'password',name: 'password',message: '请输入您的密码:',}
]).then(answers => {console.log(`您的密码是:${answers.password}`);
});

五、inquirer.js的自定义组件

inquirer.js 除了提供多种组件之外,还支持自定义组件。以下是一个自定义组件的示例,它可以按输入顺序返回用户输入:

// 自定义组件
inquirer.registerPrompt('order', function (questions, callback) {const answers = {};function questionLoop() {if (questions.length === 0) {callback(answers);return;}const currentQuestion = questions.shift();const {message,name} = currentQuestion;inquirer.prompt({type: 'input',m    essage,name,}).then(answer => {answers[name] = answer;questionLoop();});}questionLoop();
});// 使用自定义组件
inquirer.prompt([{type: 'order',name: 'order',message: '请输入顺序:',questions: [{message: '第一个:',name: 'first',},{message: '第二个:',name: 'second',},{message: '第三个:',name: 'third',},]}
]).then(answers => {console.log('您输入的顺序是:', answers.order);
});

六、inquirer.js的插件

inquirer.js 不仅支持自定义组件,还使用与可扩展性接口相对应的插件来提供更多的功能。以下是一个 inquirer.js 插件示例,它提供了一种列出文件和文件夹的方式。

const inquirer = require('inquirer');
const fs = require('fs');// 插件对象
const fileTree = {type: 'file-tree',async run(paths) {const questions = {type: 'list',name: 'path',message: '请选择您要访问的路径',choices: paths,};const {path} = await inquirer.prompt(questions);const stats = fs.statSync(path);if (stats.isDirectory()) {const files = fs.readdirSync(path).map(file => {const subPath = `${path}/${file}`;const stats = fs.statSync(subPath);return {name: file,value: stats.isDirectory() ? fileTree.run([subPath]) : subPath};});return inquirer.prompt({type: 'list',message: '请选择要访问的文件或目录:',name: 'path', choices: files});}return {path};}
};// 注册插件
inquirer.registerPrompt('file-tree', fileTree);// 使用插件
inquirer.prompt({type: 'file-tree',name: 'path',message: '请选择要访问的文件或目录:',default: '.',run() {const paths = fs.readdirSync('.');return paths.map(path => {const stats = fs.statSync(path);return {name: path,value: stats.isDirectory() ? fileTree.run([path]) : path};});}
}).then(answers => {console.log('选择的路径是:', answers.path);
});

七、inquirer.js的事件

inquirer.js提供了多个事件用于监听不同的操作,例如开始、完成、取消等。以下是一个事件示例,用于在确认取消询问后退出应用程序。

const inquirer = require('inquirer');inquirer.prompt([{type: 'confirm',name: 'confirmExit',message: '确定要退出吗?',},
]).then(answers => {if (answers.confirmExit) {process.exit(0)}
});// 监听取消事件
inquirer.on('cancel', () => {console.log('您已取消操作!');process.exit(0)
});

八、总结

在本文中,我们详细介绍了inquirer.js——一个功能强大的交互式命令行用户界面库。我们解释了inquirer.js的特点、使用场景、组件和插件。通过本文,您可以了解如何使用inquirer.js创建重复性的CLI工具或其他交互式命令行界面,并使它们更加人性化和易于使用。希望这篇文章能够帮助您更深入地了解inquirer.js,并且能够快速掌握其使用的方法。

这篇关于inquirer.js——交互式命令行用户界面的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/333031

相关文章

JS+HTML实现在线图片水印添加工具

《JS+HTML实现在线图片水印添加工具》在社交媒体和内容创作日益频繁的今天,如何保护原创内容、展示品牌身份成了一个不得不面对的问题,本文将实现一个完全基于HTML+CSS构建的现代化图片水印在线工具... 目录概述功能亮点使用方法技术解析延伸思考运行效果项目源码下载总结概述在社交媒体和内容创作日益频繁的

Node.js 数据库 CRUD 项目示例详解(完美解决方案)

《Node.js数据库CRUD项目示例详解(完美解决方案)》:本文主要介绍Node.js数据库CRUD项目示例详解(完美解决方案),本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考... 目录项目结构1. 初始化项目2. 配置数据库连接 (config/db.js)3. 创建模型 (models/

SpringShell命令行之交互式Shell应用开发方式

《SpringShell命令行之交互式Shell应用开发方式》本文将深入探讨SpringShell的核心特性、实现方式及应用场景,帮助开发者掌握这一强大工具,具有很好的参考价值,希望对大家有所帮助,如... 目录引言一、Spring Shell概述二、创建命令类三、命令参数处理四、命令分组与帮助系统五、自定

使用Node.js制作图片上传服务的详细教程

《使用Node.js制作图片上传服务的详细教程》在现代Web应用开发中,图片上传是一项常见且重要的功能,借助Node.js强大的生态系统,我们可以轻松搭建高效的图片上传服务,本文将深入探讨如何使用No... 目录准备工作搭建 Express 服务器配置 multer 进行图片上传处理图片上传请求完整代码示例

Spring Shell 命令行实现交互式Shell应用开发

《SpringShell命令行实现交互式Shell应用开发》本文主要介绍了SpringShell命令行实现交互式Shell应用开发,能够帮助开发者快速构建功能丰富的命令行应用程序,具有一定的参考价... 目录引言一、Spring Shell概述二、创建命令类三、命令参数处理四、命令分组与帮助系统五、自定义S

用js控制视频播放进度基本示例代码

《用js控制视频播放进度基本示例代码》写前端的时候,很多的时候是需要支持要网页视频播放的功能,下面这篇文章主要给大家介绍了关于用js控制视频播放进度的相关资料,文中通过代码介绍的非常详细,需要的朋友可... 目录前言html部分:JavaScript部分:注意:总结前言在javascript中控制视频播放

Windows server服务器使用blat命令行发送邮件

《Windowsserver服务器使用blat命令行发送邮件》在linux平台的命令行下可以使用mail命令来发送邮件,windows平台没有内置的命令,但可以使用开源的blat,其官方主页为ht... 目录下载blatBAT命令行示例备注总结在linux平台的命令行下可以使用mail命令来发送邮件,Win

Node.js net模块的使用示例

《Node.jsnet模块的使用示例》本文主要介绍了Node.jsnet模块的使用示例,net模块支持TCP通信,处理TCP连接和数据传输,具有一定的参考价值,感兴趣的可以了解一下... 目录简介引入 net 模块核心概念TCP (传输控制协议)Socket服务器TCP 服务器创建基本服务器服务器配置选项服

mac安装nvm(node.js)多版本管理实践步骤

《mac安装nvm(node.js)多版本管理实践步骤》:本文主要介绍mac安装nvm(node.js)多版本管理的相关资料,NVM是一个用于管理多个Node.js版本的命令行工具,它允许开发者在... 目录NVM功能简介MAC安装实践一、下载nvm二、安装nvm三、安装node.js总结NVM功能简介N

使用Go语言开发一个命令行文件管理工具

《使用Go语言开发一个命令行文件管理工具》这篇文章主要为大家详细介绍了如何使用Go语言开发一款命令行文件管理工具,支持批量重命名,删除,创建,移动文件,需要的小伙伴可以了解下... 目录一、工具功能一览二、核心代码解析1. 主程序结构2. 批量重命名3. 批量删除4. 创建文件/目录5. 批量移动三、如何安