如何编写javascript的gulp插件

 更新时间:2017年02月07日 08:37:29   作者:猴子  
本文主要介绍了使用PMD进行代码审查的方法,具有很好的参考价值,下面跟着小编一起来看下吧

很久以前,我们在"细说gulp"随笔中,以压缩JavaScript为例,详细地讲解了如何利用gulp来完成前端自动化。

再来短暂回顾下,当时除了借助gulp之外,我们还利用了第三方gulp插件”gulp-uglify”,来达到压缩JavaScript文件的目的。

代码如下:

今儿,我们的重点就是,自己也来实现一个gulp插件。

正文

其实,如果只是单纯地想要编写一个gulp插件不难,可以借助through2或者through-gulp来编写(through-gulp是基于through2开发的)。

例如,我们想要接下来即将编写的插件(暂取名为modify),实现这样的功能:将指定html文件中的{{…}},全部替换成'Monkey 2 Dorie'。

如下:

下面我们将利用through2以及through-gulp一一道来。

**through2**

'use strict'
var through2 = require('through2');
module.exports = modify;
function modify(){
 return through2.obj(function(file, encoding, cb){
 //如果文件为空,不做任何操作,转入下一个操作,即下一个pipe
 if(file.isNull()){
 console.log('isNull');
 this.push(file);
 return cb();
 }
 //插件不支持对stream直接操作,抛出异常
 if(file.isStream()){
 console.log('isStream');
 this.emit('error');
 return cb();
 }
 //内容转换,处理好后,再转成Buffer形式
 var content = versionFun(file.contents.toString());
 file.contents = new Buffer(content);
 //下面这两句基本是标配,可参考through2的API
 this.push(file);
 cb();
 });
}
function versionFun(data){
 return data.replace(/{{something}}/, ' Monkey 2 Dorie ');
}

**through-gulp**

'use strict'
var through = require('through-gulp');
module.exports = modify;
function modify(){
 var stream = through(function(file, encoding, callback){
 //如果文件为空,不做任何操作,转入下一个操作,即下一个pipe
 if(file.isNull()){
 console.log('file is null!');
 this.push(file);
 return callback(); 
 }
 //插件不支持对stream直接操作,抛出异常
 if(file.isStream()){
 console.log('file is stream!');
 this.emit('error');
 return callback(); 
 }
 //内容转换,处理好后,再转成Buffer形式
 var content = versionFun(file.contents.toString('utf-8'));
 file.contents = new Buffer(content, 'utf-8');
 this.push(file);
 callback();
 }, function(callback){
 console.log('处理完毕!');
 callback();
 });
 return stream;
}
function versionFun(data){
 return data.replace(/{{something}}/, ' Monkey 2 Dorie ');
}

详情代码见github.

拓展阅读

[1]、through-gulp

[2]、gulp规范

[3]、gulp高级技巧

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持脚本之家!

相关文章

  • Spring Boot外部化配置实战解析

    Spring Boot外部化配置实战解析

    这篇文章主要介绍了Spring Boot外部化配置实战解析,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-06-06
  • Mybatis插入数据后自增id获取方式

    Mybatis插入数据后自增id获取方式

    在MyBatis中,获取自增主键可以通过useGeneratedKeys属性或selectKey节点实现,useGeneratedKeys设置时,需设置keyProperty指定主键字段,数据库表也要相应设置,selectKey节点可在插入操作后,通过特定SQL查询获得主键
    2024-09-09
  • JXLS根据模板导出Excel实例教程

    JXLS根据模板导出Excel实例教程

    这篇文章主要为大家详细介绍了JXLS根据模板导出Excel实例教程,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-12-12
  • SpringBoot中webSocket实现即时聊天

    SpringBoot中webSocket实现即时聊天

    这篇文章主要介绍了SpringBoot中webSocket实现即时聊天,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-04-04
  • spring声明式事务@Transactional底层工作原理

    spring声明式事务@Transactional底层工作原理

    这篇文章主要为大家介绍分析spring声明式事务@Transactional底层工作原理,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步早日升职加薪
    2022-02-02
  • Java实现的求逆矩阵算法示例

    Java实现的求逆矩阵算法示例

    这篇文章主要介绍了Java实现的求逆矩阵算法,涉及java基于数组的矩阵遍历与运算相关操作技巧,需要的朋友可以参考下
    2017-09-09
  • javaWeb使用验证码实现简单登录

    javaWeb使用验证码实现简单登录

    这篇文章主要为大家详细介绍了javaWeb使用验证码实现简单登录,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-08-08
  • 深入浅出Java mvc_动力节点Java学院整理

    深入浅出Java mvc_动力节点Java学院整理

    这篇文章主要为大家详细介绍了MVC的基础知识,MVC是一个框架模式,它强制性的使应用程序的输入、处理和输出分开,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-08-08
  • SpringBoot启动访问localhost:8080报错404的解决操作

    SpringBoot启动访问localhost:8080报错404的解决操作

    这篇文章主要介绍了SpringBoot启动访问localhost:8080报错404的解决操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-10-10
  • Java利用iTextPDF库实现制作PDF表格模板并填充数据

    Java利用iTextPDF库实现制作PDF表格模板并填充数据

    这篇文章主要为大家详细介绍了如何通过Java的iTextPDF库制作一个PDF表格模板并填充数据,文中的示例代码讲解详细,感兴趣的小伙伴快跟随小编一起学习一下吧
    2023-12-12

最新评论