Watchify并不总是检测到javascript文件中的更改

我创建了一个gulp任务来与browserify捆绑模块,我正在使用watchify来监视更改.这是我的gulp任务看守：

gulp.task('watch:browserify',function () {
    var opts = assign({},watchify.args,{
        entries: ['./js/app.js'],debug: true,basedir: './app/',paths: ['./lib']
    });

    var b = watchify(browserify(opts));

    b.on('update',function () {
        bundle();
    });

    function bundle() {
        gutil.log(gutil.colors.blue("Starting browserify..."));
        var time = Date.Now();
        return b.bundle()
            .on('error',gutil.log.bind(gutil,gutil.colors.red('browserify Error')))
            .pipe(source('bundle.js'))
            .pipe(buffer())
            .pipe(sourcemaps.init({loadMaps: true}))
            .pipe(sourcemaps.write('.'))
            .pipe(gulp.dest('app'))
            .on('end',function () {
                var duration = Date.Now() - time;
                gutil.log(gutil.colors.blue('Finished browserify') + " (%dms)",duration);
            })
    }

    bundle();
});

如果我编辑主js文件(./js/app.js),则始终检测到更改.但是,当我编辑主文件需要的其他文件时,大概每隔一段时间就会检测到更改(但不总是).我在这里做错了吗？

Here is the full Github repo,所以也许你会得到一个完整的想法,我如何计划这个工作

解决方法

您的代码示例有两个问题.

首先,watch：browserify必须采取回调或返回流,否则可能会发生竞争条件,如here所述.所以,例如,任务的最后一行可能是返回bundle();.

其次,使用watchify时,缓存和packageCache选项必须传递给browserify(),如下图所示,并指定为here.

var b = browserify({ cache: {},packageCache: {} });

最后,确保app.js实际上取决于其依赖关系链中的某个位置,您正在编辑的其他文件.