Gulp 4迁移错误(您是否忘记发信号异步完成?)

时间:2016-03-24 04:04:16

标签: javascript gulp build-automation

我有一个gulp 3文件,我正在尝试升级到gulp 4.当我这样做时,一些任务工作其他人不。我得到的三个错误如下:

清理样式:

gulp.task('clean-styles', function (done) {
    var files = config.temp + '**/*.css';
    clean(files, done);
});

[23:47:05] The following tasks did not complete: clean-styles 
[23:47:05] Did you forget to signal async completion?
scss-watcher:

gulp.task('scss-watcher', function () {
    gulp.watch([config.scss], ['styles']);
});

[23:51:27] 'scss-watcher' errored after 2.46 ms
[23:51:27] Error: watching ./src/client/styles/styles.scss: watch task has to be a function (optionally generated by using gulp.parallel or gulp.series)

styles :(如果我删除了clean-styles系列,这将有效)

gulp.task('styles', gulp.series('clean-styles', function () {
log('Compiling SCSS --> CSS');

return gulp
    .src(config.scss)
    .pipe($.scss())
    .pipe($.autoprefixer({ browsers: ['last 2 versions', '> 5%'] }))
    .pipe(gulp.dest(config.temp));
}));

[23:52:42] The following tasks did not complete: styles, clean-styles
[23:52:42] Did you forget to signal async completion?

兽医:(作品)

gulp.task('vet', function () {
    log('Analyzing source with ESLint');
    return gulp
        .src(config.js)
        .pipe($.if(args.verbose, $.print()))
        .pipe($.eslint())
        .pipe($.eslint.format())
        .pipe($.eslint.failOnError());
});

功能:

function clean(path, done) {
    log('Cleaning: ' + $.util.colors.blue(path));
    del(path, done);
}

function log(msg) {
    if (typeof(msg) === 'object') {
        for (var item in msg) {
            if (msg.hasOwnProperty(item)) {
                $.util.log($.util.colors.blue(msg[item]));
            }
        }
    }
    else {
        $.util.log($.util.colors.blue(msg));
    }
}

我必须遗漏一些东西。任何人都可以填写我所缺少的内容吗?

2 个答案:

答案 0 :(得分:2)

<强>干净的样式

del不接受回调函数。它会返回您必须在任务中返回的Promise

function clean(path) {
    log('Cleaning: ' + $.util.colors.blue(path));
    return del(path);
}
gulp.task('clean-styles', function () {
    var files = config.temp + '**/*.css';
    return clean(files);
});

<强> SCSS观察家

gulp.watch()不再支持任务名称数组。您必须向其传递一个函数gulp.series()gulp.parallel()

gulp.task('scss-watcher', function () {
    gulp.watch([config.scss], gulp.series('styles'));
});

<强>样式

应该使用上面clean-styles的更改。

答案 1 :(得分:0)

朋友,这是解决此问题的方法:

我们需要调用回调函数(Task and Anonimous

   <!--HEADER ===========================================================================-->
    <header class="site-header" role="banner">
        <!-- NAVBAR ======================================================================-->
        <div class="navbar-wrapper">
            <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
                <div class="container">
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                            <span class="sr-only">Toggle navigation</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                        <a class="navbar-brand" href="/"><img src="img/jadslogo.png" alt="JADS"></a>
                    </div><!-- end navbar-header -->
                    <div="navbar-collapse collapse">
                    <ul class="nav navbar-nav navbar-right">
                        <li class="active"><a href="#">Home</a></li>
                        <li><a href="/">About Us</a></li>
                        <li><a href="/">Donate</a></li>
                        <li><a href="/">Get Involved</a></li>
                    </ul><!-- end navbar-right -->
                    </div><!-- end nvbar navbar-collapse -->
                </div><!-- end container -->                
            </div><!-- end navbar...fixed top -->
        </div><!-- end navbar-wrapper -->
    </header>