IT博客汇
  • 首页
  • 精华
  • 技术
  • 设计
  • 资讯
  • 扯淡
  • 权利声明
  • 登录 注册

    用gulp-bufferify快速创建你的gulp插件

    唐霜发表于 2017-04-12 17:13:25
    love 0

    gulp-bufferify是我之前写的一个gulp插件,其实它没有实际的功能性用处,但是利用它可以快速实现一个gulp插件。举一个栗子:

    import bufferify from 'gulp-bufferify'
    gulp.src('./**/*.txt')
        .pipe(bufferify(content => content.replace(/sam/g, 'tom')))
        .pipe(gulp.dest('.'))

    通过上面这段gulp代码,可以快速替换所有txt文档中的sam为tom。可以说,每一个gulp-bufferify就是一个插件,你可以利用它完成你想要的功能。

    我们来看看他的使用方法:

    let factory = (content, file, context, notifier) => {}
    bufferify(factory)

    工厂函数factory有四个参数:

    content

    经过toString()的文档内容,一般在处理文本类型的文档时可以直接使用。

    file

    当前buffer的file,拥有file.path, file.contents, file.clone()等有用的信息。

    context

    管道中的上下文,相当于stream中的this。可以通过它实现文件的添加修改和删除。具体的话,你还得知道stream的相关知识。

    notifier

    用在异步处理中,通知生成器,使用方法如下:

    .pipe(bufferify((content, file, context, notifier) => {
        let callback = notifier()
        setTimeout(() => callback(), 3000)
    }))

    上面这段代码是异步处理的,当callback()执行时,stream才会进入下一个管道。

    工厂函数的返回值应该是新的content,当你返回一个新的content的时候,这个buffer的内容就会被新的content替换(buffer文件是文本文件)。

    而如果你返回的值为非真时,原始的content将被使用。

    不过当你使用notifier的时候情况不同,执行notifier()就相当于告诉gulp-bufferify,你的插件将会以异步方式运行,所以这个时候你return的新的content将不会被采纳,知道你使用callback()。callback的使用方法和though2的callback使用方法是一样的,假如你修改了buffer文件,必须采用如下的形式:

    .pipe(bufferify((content, file, context, notifier) => {
        let callback = notifier()
        let newcontent = content.replace('you', 'me')
        file.contents = new Buffer(newcontent)
        setTimeout(() => callback(null, file), 3000)
    }))

    在gulp-bufferify中,真正改变stream的,主要是bufferify函数的返回值和context,返回新的content将改变file.contents,而使用context则可以在stream中新增文件。



沪ICP备19023445号-2号
友情链接