inquirer基本用法和常用属性入门

408 阅读2分钟

inquire用来做命令行交互的;

cnpm i -S inquirer@7.3.3

创建lib/inquirer/index.js文件;
inquirer基本框架:

const inquirer = require("inquirer");

inquirer
  .prompt([
    {
      type: "input",
      name: "yourName",
      message: "your name",
      default: "noName",
      validate: function (v) {
        return typeof v === "string";
      },
      transformer: function (v) {
        return "name[" + v + "]";
      },
      filter: function (v) {
        return "name[" + v + "]";
      },
    },
    {
      type: "number",
      name: "num",
      message: "your number:",
    },
  ])
  .then((answers) => {
    console.log("answers->", answers);
  })
  .catch((error) => {
    if (error.isTtyError) {
      // Prompt couldn't be rendered in the current environment
    } else {
      // Something else went wrong
    }
  });

image.png

default的属性就是加一个默认值:

image.png

validate属性用来做校验,传入一个function,返回true或false;

transformer是用来做展示信息的转换, 不会改变最终结果;

image.png

filter对当前的结果进行处理, 会改变最终结果;

image.png

prompt可以传入一个数组,也就是一系列交互;

image.png

第二个type为number的命令,会自动帮我们把输入转换成数字;

type为confirm的用法,confirm是用来做二选一的:

inquirer
  .prompt([
    {
      type: "confirm",
      name: "choice",
      message: "your choice",
      default: false,
    },
  ])
  .then((answers) => {
    console.log("answers:", answers);
  })
  .catch((error) => {
    if (error.isTtyError) {
      // Prompt couldn't be rendered in the current environment
    } else {
      // Something else went wrong
    }
  });

直接回车的时候返回的是false;

image.png

type为list的用法, 需要配置choices属性;

inquirer
  .prompt([
    {
      type: "list",
      name: "choice",
      message: "your choice",
      default: 0,
      choices: [
        {
          value: "1",
          name: "name1",
        },
        {
          value: "2",
          name: "name2",
        },
        {
          value: "3",
          name: "name3",
        },
      ],
    },
  ])
  .then((answers) => {
    console.log("answers:", answers);
  })
  .catch((error) => {
    if (error.isTtyError) {
      // Prompt couldn't be rendered in the current environment
    } else {
      // Something else went wrong
    }
  });

这里的default是0,什么都不选会默认选中第0个;

image.png

image.png

type为rawlist,和list类似,只是交互形式有些不同,最后一行会有answer,每一个选项都有序号;

image.png

type为expand,用在选择时需要用户提供简写的情况;当我们输入r时,answer就为red;输入h时,会打印出所有的选项;

inquirer
  .prompt([
    {
      type: "expand",
      name: "choice",
      message: "your choice",
      default: "red",
      choices: [
        {
          key: "R",
          value: "red",
        },
        {
          key: "G",
          value: "green",
        },
        {
          key: "B",
          value: "blue",
        },
      ],
    },
  ])
  .then((answers) => {
    console.log("answers:", answers);
  })
  .catch((error) => {
    if (error.isTtyError) {
      // Prompt couldn't be rendered in the current environment
    } else {
      // Something else went wrong
    }
  });

image.png

type为checkbox,它会给我们提示;

image.png

type为password是用来输入密码;

image.png

type为editor,可以帮我们打开一个文本编辑器,类似于我们经常用到的vim命令;