快捷導(dǎo)航

node如何實(shí)現(xiàn)cmd彈窗交互之inquirer

更新時(shí)間：2023年10月30日 09:42:10 作者：JadeFlicker

這篇文章主要介紹了node如何實(shí)現(xiàn)cmd彈窗交互之inquirer問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教

node實(shí)現(xiàn)cmd彈窗交互——inquirer

實(shí)現(xiàn)cmd彈窗交互

安裝inquirer包

npm i inquirer

引入inquirer包

var inquirer = require('inquirer');

// console.log('Hi, welcome to Node Pizza');

var questions = [
  {
    type: 'input',
    name: 'toBeDelivered',//這個(gè)參數(shù)
    message: '請(qǐng)選擇文件夾',
  }
];

inquirer.prompt(questions).then(answers => {
  console.log(answers);
});

questions為配置參數(shù)對(duì)象

type：（String）提示的類型。默認(rèn)值：input-可能的值：input，number，confirm， list，rawlist，expand，checkbox，password，editor
name：（String）將答案存儲(chǔ)在答案哈希中時(shí)使用的名稱。如果名稱包含句點(diǎn)，它將在答案哈希中定義路徑
message：（String | Function）要打印的問題。如果定義為函數(shù)，則第一個(gè)參數(shù)將是當(dāng)前查詢者會(huì)話答案。缺省值為name（后跟冒號(hào)）。

node命令交互inquirer

用過vue或者react的用腳手架新建項(xiàng)目的應(yīng)該都進(jìn)行過命令交互，vue創(chuàng)建的時(shí)候會(huì)讓你選擇vue2還是vue3，也有多選要什么配置，也有輸入y或者n選擇是否用history路由等，這其實(shí)用inquire這個(gè)包都能實(shí)現(xiàn)。

環(huán)境跟之前commander使用是一樣的，初始化之后配置bin和npm link一下，這邊就不再說了。

安裝inquirer

npm install inquirer

引入

var inquirer = require(‘inquirer');

inquirer主要知道這幾個(gè)類型類型，其他的有興趣再去了解：

input
confirm
list
checkbox
password

方法用prompt就行，另外兩個(gè)registerPrompt和createPromptModule也可以自己去了解。

我們按照順序都展示出來，不管輸入還是選擇了什么，都繼續(xù)下一種類型展示，代碼：

typeInput();

function typeInput() {
  inquirer.prompt([ {
    name: 'input',
    type: 'input',
    message: 'input: year, month and day',
    default: 'year'
  }]).then((res) => {
    console.log('Year: ' + res.input);
    typeConfirm();
  })
}

function typeConfirm(){
  inquirer.prompt([ {
    name: 'confirm',
    type: 'confirm',
    message: 'confirm',
    default: true
  }]).then((res) => {
    console.log('confirm: ' + res.confirm);
    typeList();
  })
}

function typeList(){
  inquirer.prompt([ {
    name: 'list',
    type: 'list',
    message: 'list',
    choices: ['red', 'blue', 'yellow'],
    default: 1
  }]).then((res) => {
    console.log('list: ' + res.list);
    typeCheckbox();
  })
}

function typeCheckbox(){
  inquirer.prompt([ {
    name: 'checkbox',
    type: 'checkbox',
    message: 'checkbox',
    choices: ['red', 'blue', 'yellow'],
    default: ['blue']
  }]).then((res) => {
    console.log('checkbox: ' + res.checkbox);
    typePassword();
  })
}

function typePassword(){
  inquirer.prompt([ {
    name: 'password',
    type: 'password',
    message: 'password',
    mask: false //是否出現(xiàn)*號(hào)
  }]).then((res) => {
    console.log('password: ' + res.password);
  })
}

prompt方法返回的是Promise，用的時(shí)候也可以配合async和await，返回的字段就是name字段：

typeCheckbox();
async function typeCheckbox() {
  let {checkbox} = await inquirer.prompt([
    {
      name: 'checkbox',
      type: 'checkbox',
      message:'checkbox',
      choices: ['red', 'blue', 'yellow'],
      default: ['blue']
    }
  ]);
  console.log('checkbox ' + checkbox);
}

效果：