inquirer

inquirer.js

inquirer 这个工具主要是用于用户和命令行之间的交互。举个例子我们通过vue-create创建vue项目的时候，应该会经常遇到让我们选择的项，而这些问题以及选项都可以通过inquirer去设置

安装

npm install inquirer

引用

import inquirer from inquirer; 我们打印下(cosole.log(inquirer))看看inquirer到底包含了什么？然后了解下怎么使用的有什么意义。

基本使用

• 简单的问答形式

const desc = '请对项目做一些简单的介绍！';
const frameList = ['vue',
	'react',
	'uni-app',
	'html'];
const cssLoaderList = [
	{
		key:'l',
		name:'less-loader',
		value:'less-loader'
	},
	{
		key:'s',
		name:'sass-loader',
		value:'sass-loader'
	}
];
const colors = [
	{
		name:'red',
		check:true
	},
	{
		name:'green',
	},
	{
		name:'yellow',
	}
];
// inquirer 使用户和命令行进行交互A
// 提问
inquirer.prompt(
[
	{
		// 随便用户输入
		type:'input',//交互类型
		name:'project',//存储当前问题回答的变量key，
		message:'请输入您的项目名称',//交互描述
		default:'vue-pro',//默认值
	},
	{
		type:'string',//交互类型 只能输入数字
		name:'mobile',//存储当前问题回答的变量key，
		message:'请输入您的手机号',//交互描述
		default:'',//默认值,
		validate:(val)=>{
			// 针对回答做出校验
			if(!/^1[3456789]\d{9}$/.test(val)){
				return '请输入正确的手机号！'
			}else{
				return true //rerun true 可继续 返回内容无法继续
			}
		}
	},
	{
		type:'password',// 类型设为password 则以密文输入
		name:'password',//存储当前问题回答的变量key，
		message:'请输入密码',//交互描述
	},
	{
		type:'confirm',// 类型设为password 则以密文输入
		name:'agree',//存储当前问题回答的变量key，
		message:'阅读并同意《用户隐私协议》',//交互描述
	},
	{
		type:'editor',//交互类型 编辑器类型
		name:'desc',//存储当前问题回答的变量key，
		message:'项目简介',//交互描述
		default:desc,//默认值,
	},
	{
		type:'list',//交互类型 无序列表选择
		name:'frame',//存储当前问题回答的变量key，
		message:'请选择项目搭建框架',//交互描述
		choices:frameList,//默认值,
	},
	{
		type:'expand',//交互类型 使用简写的方式选择答案
		name:'cssLoader',//存储当前问题回答的变量key，
		message:'请选择css预处理器',//交互描述
		choices:cssLoaderList,//默认值,
	},
	{
		type:'rawlist',//交互类型 有序列表选择 回答时可手动输入选择的答案
		name:'oframe',//存储当前问题回答的变量key，
		message:'有序展示选择项目搭建框架',//交互描述
		choices:frameList,//默认值,
	},
	{
		type:'checkbox',//交互类型 多选框 (Press <space> to select, <a> to toggle all, <i> to inver
		name:'color',//存储当前问题回答的变量key，
		message:'选择控制台所展示颜色',//交互描述
		choices:colors
	},
	
]).then(res=>{
	// 接收用户的答案
	console.log(res)
})

• 效果图展示

? 请输入您的项目名称 vue-pro
? 请输入您的手机号 13067833305
? 请输入密码 [hidden]
? 阅读并同意《用户隐私协议》 Yes
? 项目简介 Received
? 请选择项目搭建框架 vue
? 请选择css预处理器 sass-loader
? 有序展示选择项目搭建框架 react
? 选择控制台所展示颜色 (Press <space> to select, <a> to toggle all, <i> to invert selection, and <en
? 选择控制台所展示颜色 (Press <space> to select, <a> to toggle all, <i> to invert selection, and <en
? 选择控制台所展示颜色
{
  project: 'vue-pro',
  mobile: '13067833305',
  password: '123456',
  agree: true,
  desc: '项目简介：，，，，，按揭公司检查噶女深刻绝世风华框架和往',
  frame: 'vue',
  cssLoader: 'sass-loader',
  oframe: 'react',
  color: []
}