// plop 的入口文件 // 需要导出一个函数,函数接收一个plop对象,用于创建生成器任务 import path from 'path' import fs from 'fs' function getFolder(path) { let components = [] const files = fs.readdirSync(path) files.forEach(function(item) { let stat = fs.lstatSync(path + '/' + item) if (stat.isDirectory() === true && item !== 'components') { components.push(path + '/' + item) components.push.apply(components, getFolder(path + '/' + item)) } }) return components } module.exports = plop => { plop.setWelcomeMessage('请选择需要创建的模式:') // setGenerator可以设置一个生成器,每个生成器都可用于生成特定的文件 // 接收两个参数,生成器的名称和配置选项 plop.setGenerator('default-page', { // 生成器的描述 description: '创建一个默认页面', // 命令行提示 prompts: [ { type: 'list', name: 'path', message: '请选择页面创建目录', choices: getFolder('src/views') }, { type: 'input', name: 'name', // 接收变量的参数 message: '请输入页面文件名称', validate: v => { if (!v || v.trim === '') { return '文件名不能为空' } else { return true } } } ], // 完成命令行后执行的操作,每个对象都是动作对象 actions: data => { let relativePath = path.relative('src/views', data.path) const actions = [ { type: 'add', // 动作类型 path: `${data.path}/{{name}}.vue`, // 生成文件的输出路径 templateFile: 'plop-templates/default-page.hbs', // template 模板的文件路径,目录下的文件遵循hbs的语法规则 data: { componentName: `${relativePath} ${data.name}` } } ] return actions } }) plop.setGenerator('table-page', { description: '创建一个表格页面', prompts: [ { type: 'list', name: 'path', message: '请选择页面创建目录', choices: getFolder('src/views') }, { type: 'input', name: 'name', message: '请输入页面文件名称', validate: v => { if (!v || v.trim === '') { return '文件名不能为空' } else { return true } } } ], actions: data => { let relativePath = path.relative('src/views', data.path) const actions = [ { type: 'add', path: `${data.path}/{{name}}.vue`, templateFile: 'plop-templates/table-page.hbs', data: { componentName: `${relativePath} ${data.name}` } } ] return actions } }) plop.setGenerator('component', { description: '创建组件', prompts: [ { type: 'confirm', name: 'isGlobal', message: '是否为全局组件', default: true }, { type: 'list', name: 'path', message: '请选择组件创建目录', choices: getFolder('src/views'), when: answers => { return !answers.isGlobal } }, { type: 'input', name: 'name', message: '请输入组件名称', validate: v => { if (!v || v.trim === '') { return '组件名称不能为空' } else { return true } } } ], actions: data => { let path = '' if (data.isGlobal) { path = 'src/components/{{properCase name}}/index.vue' } else { path = `${data.path}/components/{{properCase name}}/index.vue` } const actions = [ { type: 'add', path: path, templateFile: 'plop-templates/component.hbs' } ] return actions } }) }