【常用的Npm包】Inquirer

Inquirer.js可以理解成就是给输入命令行的用户提供一个好看的界面，提供一下功能：

• 有错误反馈；
• 向用户提问；
• 解析输入；
• 校验回答；
• 能在用户输入的时候提供友好的提示。

安装

yarn add inquirer --save-dev

使用

我们简易的模仿一下vue-cli:

• 先问用户是选用默认的预设，还是自己定义，如果是默认则退出，如果自定义，则进入下一步；
• 让用户多选预设，如babel、typescript等。

prompt方法中提供配置项，then会在用户回答完所有问题后执行，catch则是报出异常：

var inquirer = require('inquirer');
inquirer.prompt([])
	 	.then((answers) => { console.log(JSON.stringify(answers, null, '  ')); })
		.catch((error) => {console.log(error);} )

prompt是一个对象数组，对象主要包含以下几种配置：

• type： 类型，主要类型有input、number、confirm、list、rawlist、expand、checkbox、password、editor；
• name：可以理解成当前回答的变量名；
• message：问题描述；
• default：问题的默认值；
• choice：问题选项；
• validate：回答的校验器；
• filter：回答的过滤器；
• transformer：接收用户输入，回答散列和选项标志，并返回一个转换后的值显示给用户。
• when：是否应该问这个问题；
• PageSize：控制选项显示的个数，就是是否当前最多显示多少个选项，如果超过则需要向下才能显示更多；
• prefix：更改默认的前缀消息。
• suffix：更改默认后缀消息。
• askAnswered：如果答案已经存在，就必须提出问题。
• loop：是否启用列表循环。

var inquirer = require('inquirer');
inquirer.prompt([{
  type: 'list',
  name: 'preset',
  message: 'Please pick a preset:',
  choices: ['default(babel, eslint)', 'Manually select feature'],
  filter: function(val){
    return val.toLowerCase();
  }
}, {
  type: 'checkbox',
  name: 'features',
  message: 'Checkout the feature needed for you project:',
  choices: [{
    name: 'Babel',
  }, {
    name: 'TypeScript',
  },{
    name: 'Progressive Web App (PWA) Support',
  }, {
    name: 'Router',
  },{
    name: 'Vuex',
  }, {
    name: 'CSS Pre-processors',
  }, {
    name: 'Linter / Formatter',
  }, {
    name: 'Unit Testing',
  }, {
    name: 'E2E Testing',
  }],
  pageSize: 9,
  validate: function(answer){
    if(answer.length < 1){
      return 'You must choose at least one topping.';
    }

    return true;
  }
}]).then(answers => {
  console.log(JSON.stringify(answers, null, '  '));
}).catch(error => {
  console.log(error);
})

再进行条件显示：

var inquirer = require('inquirer');
function exitPreset(){
  inquirer.prompt([{
    type: 'list',
    name: 'preset',
    message: 'Please pick a preset:',
    choices: ['default(babel, eslint)', 'Manually select feature'],
    filter: function(val){
      return val.toLowerCase();
    },
  }]).then((answers) => {
    if(answers.preset === 'manually select feature'){
      exitFeature();
    }else {
      console.log(JSON.stringify(answers, null, '  '));
    }
  })
}

function exitFeature(){
  inquirer.prompt([{
    type: 'checkbox',
    name: 'features',
    message: 'Checkout the feature needed for you project:',
    pageSize: 9,
    choices: [{
      name: 'Babel',
    }, {
      name: 'TypeScript',
    },{
      name: 'Progressive Web App (PWA) Support',
    }, {
      name: 'Router',
    },{
      name: 'Vuex',
    }, {
      name: 'CSS Pre-processors',
    }, {
      name: 'Linter / Formatter',
    }, {
      name: 'Unit Testing',
    }, {
      name: 'E2E Testing',
    }],
    default: ['Babel', 'Linter / Formatter'],
    validate: function(answer){
      if(answer.length < 1){
        return 'You must choose at least one topping.';
      }
      return true;
    }
  }]).then((answers) => {
    if(answers.preset === 'Manually select feature'){
      exitFeature();
    }else {
      console.log(JSON.stringify(answers, null, '  '));
    }
  })
}

function main(){
  exitPreset();
}

main();

更多配置查看： Inquirer.js