前端工程化-脚手架Plop

342 阅读1分钟

        除了像Yeoman这样的大型脚手架工具,还有一些小型的脚手架工具比如PlopPlop是一款主要用于创建项目中特定类型的文件的小工具,它有点类似于Yeomansub Generator 不过它一般不会独立去使用。一般我们都会把Plop集成到项目当中,用来自动化去创建同类型的项目文件。

        使用Plop的第一步就是将Plop最为一个npm模块安装到我们项目当中,安装完成过后需要在项目根目录下创建一个plopFile文件。这个文件是Plop的入口文件,它需要导出一个函数而且在这个函数当中,可以接受一个Plop的对象这个对象里面提供了一些列的工具函数,用于去帮助我们创建生成器的任务。

module.exports = plop => {
    plop.setGenerator(
        'comopnent', // 生成器的名字
        { // 生成器的配置选项
            description: '', // 生成器描述
            prompts: [ // 生成器工作时发出的命令行问题
                {
                    type: 'input', // 指定这个问题的输入方式
                    name: 'filename', // 指定这个问题返回值的键名
                    message: '', // 命令行给出的提示
                    default: '' // 默认值
                }
            ],
            actions: [ // 生成器在完成命令行交互过后需要执行的一些动作,数组中的每一个对象就是一个动作对象
                {
                    type: 'add', // 动作的类型
                    path: 'scr/commponents/{{filename}}/{{filename}}.js', // 指定输出目录
                    templateFile: 'plop-templetes/component.hbs' // 指定模板文件
                }
            ]
        }
    )
}

使用步骤:

  1. 将Plop模块作为项目依赖进行安装

  2. 在项目的根目录下创建 plopfile.js 文件

  3. plopfile.js文件中定义脚手架任务

  4. 编写用于生成特定类型文件的模版文件

  5. 通过Plop提供的CLI运行脚手架任务