使用 gulp-coffeeify + watch，如何在文件修改时重新遍历 coffeeify 所有依赖？

Question

我在项目中使用了CoffeeScript以及Gulp，最近采用了Browserify这个模块化方案，对应的gulp插件有gulp-browserify，而gulp-coffeeify是forCoffeeScript的，但是我在项目中使用watch的时候，却发现它监测到文件改动的时候，仅仅是改动该文件，而不是所有与它有依赖关系的文件。举个例子：
gulpfile.js
varMODULARIZE_LIST=[
'js/www/main.coffee',
'js/shared/modules/*'
];
varconfig={
assetsDir:'resource/assets/',
publicAssetsDir:'resource/public/assets/'
};
functiongetModularizedList(){
varsrc=[];
for(i=0;isrc.push(config.assetsDir+MODULARIZE_COFFEE_IGONRE_LIST[i]);
returnsrc;
}
gulp.task('watch:coffeeify',function(){
varsrc=getModularizedList();
returngulp.src(src,{base:config.assetsDir+'js'})
.pipe(watch(src,{base:config.assetsDir+'js'}))
.pipe(coffeeify().on('error',gutil.log))
.pipe(gulp.dest(config.publicAssetsDir));
});
main.coffee:
sayHi=require'../shared/modules/sayHi'
sayHi'Jack'
sayHi.coffee:
module.exports=(name)->
console.log"Hi,#{name}"
当我将sayHi.coffee中的Hi改为Hello并保存后，它仅仅会coffeeifysayHi.coffee，而并不会把依赖它的main.coffee也重新打包，所以这个watch基本是没有什么作用的，现在每次都需要手动去coffeeify，很麻烦，不知道有什么办法？

Answer 1

既然被@JasinYip点名了就来答一下2333。我们现在的方案是直接使用browserify,coffeeify和gulp，而不是gulp-browserify这个插件。为了将browserify中的文本流转换成gulp使用的vinyl-fs流，我们需要使用vinyl-source-stream插件。如果想使用gulp-concat,gulp-uglify这样的gulp插件，则要使用vinyl-buffer来对流进行处理。同时如果希望直接对gulp使用的vinyl流使用纯文本的transform函数/插件（比如map-stream等）处理的话，则可以引入vinyl-transform。至于watch模式，我们现在的方案是，使用gulp-watch（当然在gulp4.x里这个插件已经不必要了），来观察指定目录下文件的增删改，有增加的文件，将其初始化打包(browserify)一次，并添加到watchify的观察列表watchers里。对于删除的文件，将其从watchers中移除。关于这些插件的原理，以及node.js的stream，我最近打算写一篇博客详细写一下，欢迎大家关注大忽悠=_=。

Answer 2

我之前为了增量构建而写了一个反向依赖收集。原理也比较简单，遍历所有模块文件，用正则提取依赖。目前速度还不错，两秒内可以完成250多个模块的收集，你可以用缓存提升速度，我为了构建的正确性并没有使用缓存。