Question

迁移到Gulp 4我遇到了严重的问题：使用gulp.watch或gulp-watch时对更改没有反应。

import gulp from 'gulp';
// import {get as browserSync} from 'browser-sync';
import watch from 'gulp-watch';

// const bs = browserSync('server');


var bSync = require('browser-sync').create();
gulp.task('browser-sync', function() {
    bSync.init({
        server: {
            baseDir: "../"
        },
        notify: true
    });
});


gulp.task('watch', gulp.parallel('browser-sync', ()=> {
    global.watch = true;

    gulp.watch('app/{styles,blocks}/**/*.+(less|styl)', gulp.series('styles', 'styles:lint', bSync.reload('styles/app-min.css')));
    gulp.watch(['app/+(images|fonts)/**/*', 'app/*.html'], gulp.parallel('copy', bSync.reload)); // or watch( instead of gulp.watch(

    gulp.start('scripts:watch');
    bSync.reload();
}));

和脚本代码：

import gulp from 'gulp';
import errorHandler from 'gulp-plumber-error-handler';
import makeWebpackConfig from '../webpack.conf.js';
import webpack from 'webpack';

const {NODE_ENV, NOTIFY} = process.env;
const isDebug = NODE_ENV !== 'production';
const scriptsErrorHandler = errorHandler('Error in \'scripts\' task');

function runWebpack(watch = false) {
    return function (callback) {
        const webpackConfig = makeWebpackConfig({
            watch,
            debug: isDebug,
            sourcemaps: isDebug,
            notify: NOTIFY
        });

        return webpack(webpackConfig, (error, stats) => {
            const jsonStats = stats.toJson();
            if (jsonStats.errors.length) {
                jsonStats.errors.forEach(message => {
                    scriptsErrorHandler.call({emit() {}}, {message});
                });
            }

            if (watch === false) callback();
        });
    };
}

gulp.task('watch', runWebpack(false));    
gulp.task('scripts:watch', runWebpack(true));

我的任务位于任务文件夹内。为了加载任务，默认任务使用gulp-hub模块：

var HubRegistry = require('gulp-hub');
gulp.registry(new HubRegistry(['*.js']));

这里出什么问题了？

Answer 1

对不起，我没有尽快回复。

我仍然习惯于使用Gulp 4，但是我遇到的问题一直与不提供回调有关。我不确定这是否是最佳实践，但是当有疑问时，我只是对每个单独的任务进行了回调。对于初学者，我会尝试这样做-在'watch'和'browser-sync'中添加一个空的回调。另外，我将把gulp.task（'watch'...）中的第二个参数更改为串行而不是并行，因为watch中的功能取决于'browser-sync'。

让我知道那些人能否带您到任何地方-抱歉，我没有更多帮助。

Gulp4手表对变化无反应

1 个答案: