Watchify並不總是檢測javascript文件中的更改

Question

我創建了一個gulp任務，用於使用browserify捆綁模塊，我使用watchify來監視更改。 以下是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），則始終檢測到更改。 但是，當我編輯主文件所需的其他文件時，大致每隔一段時間（但並非總是）檢測到更改。 我在這里做錯了嗎？

這是完整的Github回購，所以也許你完全了解我如何計划這個工作

Answer 1

您的代碼示例有兩個問題。

首先， watch:browserify必須要么需要一個回調或返回流，或者發生競爭條件，討論在這里 。 因此，例如，您的任務中的最后一行可能是return bundle(); 。

其次，使用watchify時，必須將cache和packageCache選項傳遞給browserify() ，如下所示並在此處指定。

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

最后，確保app.js實際上依賴於其依賴鏈中的某個位置，而不是您正在編輯的其他文件。

Answer 2

我有同樣的問題，我已經提到@akarve所提到的一切正確。 我回去watchify: "^2.6.0" ，問題解決了。 然而，構建/檢測時間稍微慢一點 - 大約半秒鍾。 然而，偶爾（經常！）沒有比watchify檢測到我的更改更好。

這里的相關討論（也是我發現有關v2.6.0的評論） - https://github.com/substack/watchify/issues/216#issuecomment-119285896