gulp搭配命令行参数实现前端自动化构建的多样化

上面一篇文章简单介绍了gulp的相关知识及在项目中如何使用gulp进行自动化构建,本文简单介绍下如何搭配gulp做一些其他的逻辑处理,只是提供一种思路,不表示可以完全套用。

如果没有合适的插件怎么办?

通过npm安装的gulp插件,都是先想想自己要的需求,然后上npm社区找,万一找不到或者自己不会找,怎么办?

  • 假设一个需求
    我们先假设一个简单的需求:每次发布指令生成的文件带上当前时间信息。
  • 处理思路
    拿到这个需求第一反应可能还是先上社区找一下,没找到,怎么办?试着变通一下,如果没找到,那我自己写一个插件岂不是也可以。
    想法很好,也可以行得通,目前有through2插件可以帮助我们写gulp插件,但是写一个插件对一个gulp初学者来说可能还是比较难的事情,那么我们换一个思路。
    我们可以尝试在每次gulp.dest前,先给最终要生成的文件重命名,添加时间戳,这样可以保证正常情况下每次构建后的文件跟之前文件名都不一样。
  • 实现
    简单的根据时间戳重命名,单个文件还好,多个文件的话,由于很多异步操作,记录时间的时刻必须比较特别,选用执行命令的那一刻可能更好些。

有些时候,开发版指令可能需求简单些,或者单个task的需求简单些,这时可以用命令行参数搭配使用来方便构建。

搭配命令行参数

命令行参数可以用process.argv获取,拿到的第三个参数,可以表示为当前task的参数。
因此,我们可以拿这个来做简单的区分,如果是特殊命令,可以选择携带一个特殊的参数,这样不用每次都单独写任务来表示。

使用多彩的控制台输出

npm社区有不少模块可以帮助生成多彩的控制台输出,虽然这对项目构建没有实际的作用,但是可以很清楚的区分当前使用的任务。

替换多个输出的文件名

如果有需求是替换某个文件夹中的所有文件名,此需求与上面的需求类似,可以一起进行。
具体代码可以自己琢磨,可以使用path模块的path.join方法来实现。

最后

由于自己对这方面也不是很熟悉,只是根据自己的经验提供一个解决问题的思路,希望可以举一反三,而不是滥用。



money☜☜☜ wechat 『『『 reward 点击扫码打赏 ~~~ ^_^ 』』』alipay ☞☞☞ money