脚手架工具plop

plop    一个小而美的脚手架工具

      plop 用于创建项目中特定类型的文件的工具。

案例 每创建一个文件夹 对应自动生成3个文件 js css html

• 下载plop yarn add plop --dev

• 在当前项目下创建一个plopfile.js的文件

  //plopfile.js
  // plop入口文件 需要导出一个函数
  module.exports=function(plop){
      plop.setGenerator("component",{  //设定一个生成器
          description:"create a component", //对这个生成器的描述
          prompts:[  //提示
              {
                  type:"input",  //交互类型
                  name:"name", //参数名称
                  message:"component name", //交互提示
                  default:"myComponent"//默认值
              }
          ],
          actions:[
              {
                  type:"add",
                  path:"src/components/{{name}}/{{name}}.js", //{{}}双大括号内设置动态参数
                  templateFile:"templates/template.hbs"//模板所在地址使用hbs文件
              },
            {
                  type:"add",
                  path:"src/components/{{name}}/{{name}}.css",
                  templateFile:"templates/template.hbs"
              },
              {
                  type:"add",
                  path:"src/components/{{name}}/{{name}}.html",
                  templateFile:"templates/template.hbs"
              }
          ]
      })
  }
  
  

  完成之后 指令 yarn plop component component是生成器，就可以生成对应得生成器