InqureJS:手搓脚手架必备!让你的命令行交互花里胡哨!

简介: 【10月更文挑战第5天】InqureJS:手搓脚手架必备!让你的命令行交互花里胡哨!

如果想自己做一个脚手架或者在某些时候在 CMD 窗口进行交互,这个时候就可以使用 inquirer.js。

首先npm init 初始化一个文件夹,来测试这个库,然后安装包:

npm install --save inquirer

再在文件夹里面新建一个 app.js,接下来的所有测试均在这个文件里面。

简单功能参数介绍

  • type:表示提问的类型,包括:input、confirm、 list、rawlist、expand、checkbox、password、editor。
  • name: 存储当前输入的值。
  • message:问题的描述。
  • default:默认值。
  • choices:列表选项,在某些type下可用,并且包含一个分隔符(separator);
  • validate:对用户的回答进行校验。
  • filter:对用户的回答进行过滤处理,返回处理后的值。
  • when:根据前面问题的回答,判断当前问题是否需要被回答。
  • pageSize:修改某些type类型下的渲染行数。
  • prefix:修改message默认前缀。
  • suffix:修改message默认后缀。

input输入

一个输入

const inquirer = require("inquirer");
inquirer.prompt([
    {
   
        type:"input",
        message:"请输入你的姓名:",
        name:"name",
        default:"大傻子"
    }
]).then(answer=>{
   
    // 用户输入的结果最终会在这里输出
    console.log(answer);
});

运行测试结果:

C:\Users\Administrator\Desktop\propt>node app.js
? 请输入你的姓名: Condoe Hero
{
    name: 'Condoe Hero' }

C:\Users\Administrator\Desktop\propt>

两个输入

const inquirer = require("inquirer");
inquirer.prompt([
    {
   
        type:"input",
        message:"请输入你的姓名:",
        name:"name",
        default:"大傻子"
    },
    {
   
        type:"input",
        message:"请输入你的年龄:",
        name:"age",
        default:18
    }
]).then(answer=>{
   
    // 用户输入的结果最终会在这里输出
    console.log(answer);
});

程序运行结果:

C:\Users\Administrator\Desktop\propt>node app.js
? 请输入你的姓名: Condor Hero
? 请输入你的年龄: 18
{
    name: 'Condor Hero', age: 18 }

C:\Users\Administrator\Desktop\propt>

validate验证

const inquirer = require("inquirer");
inquirer.prompt([
    {
   
        type:"input",
        message:"请输入你的姓名:",
        name:"name",
        default:"大傻子"
    },
    {
   
        type:"input",
        message:"请输入你的年龄:",
        name:"age",
        default:18,
        validate:(val)=>{
   
            if(val > 10 && val < 120){
   
                return val;
            }else{
   
                return "我猜你绝对不是一个正常人类";
            }
        }
    }
]).then(answer=>{
   
    console.log(answer);
});

测试结果:

C:\Users\Administrator\Desktop\propt>node app.js
? 请输入你的姓名: 大傻子
? 请输入你的年龄: (18) 18
>> 18

confirm确认

const inquirer = require("inquirer");
inquirer.prompt([
    {
   
        type:"confirm",
        message:"是否现在监听?",
        name:"watch",
        default:true
    },
    {
   
        type: "confirm",
        message: "是否能看到我取决于上面是否通过?",
        name: "pass",
        suffix: "后缀",
        when: function(answer) {
    // 当watch为true的时候才会到达这步
            return answer.watch//只有我return true才会这个confirm
        }
    }
]).then(answer=>{
   
    console.log(answer);
});

看看三种不同输入结果有啥变化?

前缀和后缀

const inquirer = require("inquirer");
inquirer.prompt([
    {
   
        type:"confirm",
        message:"是否现在监听?",
        name:"watch",
        default:true,
        prefix:"☆☆☆☆"//前缀
    },
    {
   
        type: "confirm",
        message: "是否能看到我取决于上面是否通过?",
        name: "pass",
        suffix: "****",//后缀
        when: function(answer) {
    // 当watch为true的时候才会到达这步
            return answer.watch //只有我return true才会这个confirm
        }
    }
]).then(answer=>{
   
    console.log(answer);
});

list 选项组

使用箭头选择

list 一般配合 choices 使用:

const inquirer = require("inquirer");
inquirer.prompt([
    {
   
        type:"list",
        message:"请选择一个选项:",
        name:"fruit",
        default:"Apple",
        prefix:"☆☆☆☆",
        suffix:"****",
        choices:[
            "Apple",
            "pear",
            "Banana"
        ],
        filter: function (val) {
    // 使用filter将值变为大写
            return val.toUpperCase();
        }
    }
]).then(answer=>{
   
    console.log(answer);
});

查看动图效果:

使用数字选择

list 改成 rawlist

const inquirer = require("inquirer");
inquirer.prompt([
    {
   
        type:"rawlist",
        message:"请选择一个选项:",
        name:"fruit",
        default:"Apple",
        prefix:"☆☆☆☆",
        suffix:"****",
        choices:[
            "Apple",
            "pear",
            "Banana"
        ],
        filter: function (val) {
    // 使用filter将值变为大写
            return val.toUpperCase();
        }
    }
]).then(answer=>{
   
    console.log(answer);
});

使用简写(自动扩展成全写)

const inquirer = require("inquirer");
inquirer.prompt([
    {
   
        type:"expand",
        message:"请选择一个颜色:",
        name:"color",
        default:"red",
        choices:[
            {
   
                key : 'R',
                value : "red"
            },
            {
   
                key : 'B',
                value : "blue"
            },
            {
   
                key : 'G',
                value : "green"
            }
        ]
    }
]).then(answer=>{
   
    console.log(answer);
});

自己可以试试按下 h/H 回车的页面是啥。

多选和分隔符

const inquirer = require("inquirer");
inquirer.prompt([
    {
   
        type:"checkbox",
        message:"选择一至多种颜色:",
        name:"color",
        choices:[
            {
   
                name : "red"
            },
            new inquirer.Separator(), // 添加分隔符
            {
   
                name : "blue"
            },
            {
   
                name : "green"
            },
            {
   
                name : "pink",
                checked : true//默认
            },
            new inquirer.Separator("--- 分隔符 ---"), // 自定义分隔符
            {
   
                name : "orange"
            }
        ]
    }
]).then(answer=>{
   
    console.log(answer);
});

如果不想自定义还可以:

const inquirer = require("inquirer");
inquirer.prompt([
    {
   
        type:"checkbox",
        message:"选择一至多种颜色:",
        name:"color",
        choices:[
            "red",
            "blue",
            "green",
            "pink",
            "orange"
        ]
    }
]).then(answer=>{
   
    console.log(answer);
});

密码

const inquirer = require("inquirer");
inquirer.prompt([
    {
   
        type:"password",
        message:"请输入你的密码:",
        name:"pwd"
    }
]).then(answer=>{
   
    console.log(answer);
});

输入数字

const inquirer = require("inquirer");
inquirer.prompt([
    {
   
        type:"number",
        message:"请输入数字:",
        name:"num"
    }
]).then(answer=>{
   
    console.log(answer);
});

编辑器

使用首选编辑器打开一个临时文件,用户退出编辑器后,将读取临时文件的内容。首选编辑器可以指定。

const inquirer = require("inquirer");
inquirer.prompt([
    {
   
        type:"editor",
        message:"写下你想写的东西:",
        name:"editor"
    }
]).then(answer=>{
   
    console.log(answer);
});

image.png

行数

用来更改显示行数只对list, rawList, expand 或 checkbox有效。

const inquirer = require("inquirer");
inquirer.prompt([
    {
   
        type:"checkbox",
        message:"选择一至多种颜色:",
        name:"color",
        choices:[
            "red",
            "blue",
            "green",
            "pink",
            "orange"
        ],
        pageSize:1
    }
]).then(answer=>{
   
    console.log(answer);
});

只有一行,通过上下方向键来选择:

image.png

相关文章
|
4月前
|
Python
惊呆了!学会这一招,你的Python上下文管理器也能玩出花样来文管理器也能玩出花样来
【7月更文挑战第6天】Python的上下文管理器是资源优雅管理的关键,与with语句结合,确保资源获取和释放。通过实现`__enter__`和`__exit__`,不仅能做资源分配和释放,还能扩展实现如计时、自动重试、事务处理等功能。例如,TimerContextManager类记录代码执行时间,展示了上下文管理器的灵活性。学习和利用这一机制能提升代码质量,增强功能,是Python编程的必备技巧。
31 0
|
4月前
|
数据库连接 数据库 Python
惊!Python 上下文管理器竟能如此 DIY,你的代码管理从此焕然一新🎉
【7月更文挑战第3天】Python的上下文管理器是资源管理的关键,保证了如文件或数据库连接的适时打开和关闭,提升代码可读性和可靠性。使用`with`语句结合`__enter__`和`__exit__`方法能简洁地处理异常和资源释放,例如在文件操作中,避免了手动关闭文件的需要。这降低了出错风险,使代码更整洁。
27 0
|
6月前
|
安全 开发工具
微信小游戏制作工具中的键盘插件的使用
微信小游戏制作工具中的键盘插件的使用
396 0
|
6月前
|
存储 开发者
彻底搞懂微信小游戏制作工具中的函数
彻底搞懂微信小游戏制作工具中的函数
153 0
|
JavaScript 前端开发 开发工具
简简单单一个vite⚡⚡插件搞定用户的另类需求——自给自足的感觉真好
简简单单一个vite⚡⚡插件搞定用户的另类需求——自给自足的感觉真好
|
存储 索引 容器
灰太狼系列—打地鼠(内含源码) inscode中的直观运行
灰太狼系列—打地鼠(内含源码) inscode中的直观运行
微信小游戏制作工具中的等待积木应该如何使用?
生活中我们总避免不了要等待,整装待发的准备去公司开始新一天的奋斗,但是公交车却迟迟不来,需要等待。一家人订好了周末出游计划,正准备出门,老婆要再选件衣服,擦个脸,需要等待。打开电视看想看的节目,出来了 60 秒的广告,需要等待……
108 0
|
前端开发 JavaScript API
晒一晒我的简易版热更新
前端项目开发过程中热更新的机制大家都知道,不知道你在开发的时候是否做了这方面的配置。 相信接触最多的就是 webpack 的热更新,文件保存后页面自动刷新,或者 css 自动更新,页面的样式在不刷新页面的情况下就会更新。 还有就是模块热替换。 热更新机制很好玩,能提升不少开发效率,但是只是处于会用的阶段不是我们的目的,我们应该适当的深入学习下,看看他背后的原理,一个是否思考过,一个是否能自己实现。
195 0
晒一晒我的简易版热更新
|
算法 C++
c++编写简易版2048小游戏
c++编写简易版2048小游戏
|
jenkins Java 应用服务中间件