[英]Watchify detecting changes but output doesn't change
我有以下gulpfile
gulp.task('browserify', function() {
bundle(false);
});
gulp.task('browserify-watch', function() {
bundle(true);
});
function bundle (performWatch) {
var bify = (performWatch === true
? watchify(browserify(finalBrowserifyOptions))
: browserify(finalBrowserifyOptions));
if (performWatch) {
bify.on('update', function () {
console.log('Updating project files...');
rebundle(bify);
});
}
bify.transform(babelify.configure({
compact: false
}));
function rebundle(bify) {
return bify.bundle()
.on('error', function () {
plugins.util.log('Browserify error');
})
.pipe(source('bundle.js'))
.pipe(buffer())
.pipe(plugins.sourcemaps.init({loadMaps: true}))
.pipe(plugins.sourcemaps.write('./'))
.pipe(gulp.dest(paths.build + assets.js));
}
return rebundle(bify);
}
麻煩的是, gulp browserify
可以正常工作。 但是, gulp browserify-watch
會檢測到更改,但是輸出永遠不會更新。
我究竟做錯了什么?
我在文件更改檢測中遇到了相同的watchify故障(包括gulp和grunt)。 CLI watchify可以按預期工作。 例如:
watchify ./src/app.js -t babelify --outfile ./build/bundle.js -v
目前,我切換到browserify-incremental 。 關於觀察方法的觀點是不同的。 這是他們的Github頁面上最能體現它的段落:
browserify-incremental可以檢測到兩次運行之間發生的更改,這意味着它可以用作按需調用的構建系統的一部分,而無需耗時很長的過程。 每次啟動時首次運行時watchify速度很慢,而每次啟動后,每次增量瀏覽器的速度都很快。
這是利用“瀏覽器”增量式“轉換”的CLI命令:
browserifyinc ./src/app.js -t babelify --outfile ./build/bundle.js -v
這是用於觀看和[重新捆綁]的簡單gulpfile.js腳本:
var gulp = require('gulp');
var sourcemaps = require('gulp-sourcemaps');
var source = require('vinyl-source-stream');
var buffer = require('vinyl-buffer');
var browserify = require('browserify');
var babel = require('babelify');
var browserifyInc = require('browserify-incremental');
var bundleApp = function() {
var browserifyObj = browserify('./src/app.js', { debug: false, cache: {}, packageCache: {}, fullPaths: true }).transform(babel);
var bundler = browserifyInc(browserifyObj, {cacheFile: './browserify-cache.json'});
bundler.on('time', function (time) {
console.log('-> Done in ' + time/1000 + ' ms');
});
console.log('-> Bundling...');
bundler.bundle()
.on('error', function(err) { console.error(err); this.emit('end'); })
.pipe(source('bundle.js'))
.pipe(buffer())
.pipe(sourcemaps.init({ loadMaps: true }))
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('./build'));
};
gulp.task('browserify', function () {
gulp.watch('./src/**/*.js', function () {
return bundleApp();
});
});
gulp.task('default', ['browserify']);
看起來一切正常,我的IDE Webstorm正在緩存文件。 當我查看包裝盒上的實際文件時,情況很好。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.