简单谈谈gulp-changed插件
前言
gulp-changed插件的作用，是用来过滤未被修改过的文件，只有修改后的文件才能通过管道。这样做的好处时，只处理修改后的文件，减少后续程序的执行时间。
根据官方给出的例子：
constSRC='src/*.js';
constDEST='dist';
gulp.task('default',()=>{
returngulp.src(SRC)
.pipe(changed(DEST))
.pipe(gulp.dest(DEST))
.pipe(/*其他操作*/);
});
检测SRC中的文件，然后把从changed()通过的文件输出到DEST文件夹中，然后继续进行后续的操作。在这之前，我写的代码是这样子的，没有传入参数，也没有输出到某文件夹中（gulp.dest(DEST)）：
gulp.task('default',()=>{
returngulp.src('src/*.js')
.pipe(changed())
.pipe(/*其他操作*/);
});
然后发现，每次执行时，所有的文件都会通过管道，根本没有过滤的作用。看了源代码之后才知道，传递参数和文件输出是必须的，因为程序里是拿两个文件夹SRC和DEST里的文件进行对比的。
每当检测一个程序时，都会去DEST里的文件夹里寻找这个对应的文件，若DEST最后修改时间发生变化或内容已更新，则表明这是一个新文件，通过管道，否则保留。程序里目前使用的是两个文件最后修改时间的对比，若SRC里的文件的最后修改时间比DEST里文件的最后修改时间要大，说明该文件被修改过。
当然，gulp-changed还提供了一种比较函数：内容的对比。将源文件和目标文件的内容进行sha1加密后，比较两者的加密串，若不相同，则通过管道。
可通过传递参数修改比对函数：
gulp.task('default',()=>{
returngulp.src(SRC)
.pipe(changed(DEST,{hasChanged:changed.compareSha1Digest}))
.pipe(gulp.dest(DEST))
.pipe(/*其他操作*/);
});
当然，你可以传递自己定义的函数，但是需支持以下4个参数：
- stream文件通过对比后将sourceFile添加到队列中
- callback函数里的代码执行完毕后的回调函数
- sourceFilevinyl文件对象
- destPath与sourceFile文件对比的目标文件路径
源码讲解
这个方法里，是对两个文件最后修改时间的对比
functioncompareLastModifiedTime(stream,cb,sourceFile,targetPath){
//获取目标文件的状态
fs.stat(targetPath,function(err,targetStat){
//若源文件存在
if(!fsOperationFailed(stream,sourceFile,err)){
//对比两者的最后修改时间
if(sourceFile.stat.mtime>targetStat.mtime){
stream.push(sourceFile);
}
}
cb();
});
}
这里有个疑问的地方：
- 若目标文件不存在，则当前情况是无法进行比较的，只能在运行一次之后，产生了目标文件；再修改源文件才能进行对比；新添加的文件同理
mtime,atime,ctime
上面中的mtime表示修改时间，此外，文件还几个跟时间有关的属性，这里也稍微的讲解一下。
ATIME-ACCESSTIME
该字段表示文件中的数据最后一次被访问的时间–通过unix进行直接读取或通过命令行和脚本读取。
CTIME-CHANGETIME
当您更改文件的所有权或访问权限时，ctime也随之变化。当然，内容更新时，ctime也会发生改变。
MTIME-MODIFYTIME
最后修改时间显示上次更改文件内容的时间。它不与文件权限的变化而变化，并因此用于跟踪文件内容的实际变化。
通过LS显示这三种时间
最简单的确认这些时间的方式是使用ls命令，我现在用的是windows系统，安装了一个ConEmu。
使用ls-l显示的时间就是当前文件最后一次修改的时间，即mtime:
-rw-r--r--1root1049089 2676一月2003:06gulpfile.js
使用ls-lu显示的是文件最后一次被访问的时间，即atime:
-rw-r--r--1root1049089 2676十一2409:18gulpfile.js
使用ls-lc显示的是文件最后一次权限被修改的时间，即ctime:
-rw-r--r--1root1049089 2676一月2003:06gulpfile.js
通过STAT显示这三种时间
使用stat命令可以显示这个文件更加详细的信息：
$statgulpfile.js File:‘gulpfile.js' Size:2676Blocks:4IOBlock:65536regularfile Device:d6be5777h/3602798455dInode:844424930178810Links:1 Access:(0644/-rw-r--r--)Uid:(1435492/root)Gid:(1049089/UNKNOWN) Access:2015-11-2409:18:34.008292400+0000 Modify:2016-01-2003:06:34.035859700+0000 Change:2016-01-2007:04:40.432046400+0000 Birth:2015-11-2409:18:33.965292400+0000
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流。