Gulp error Did you forget to signal async completion on babel compilation

Question

Getting Gulp error: The following tasks did not complete: Did you forget to signal async completion? when trying to run the below code. However in case of css it works fine

Not working

gulp.task('babel', () => {
    console.info('-------GULP BABEL -----');
    return gulp.src([
        `${setting.folder.babelComponentPath}**/*.babel.js`
    ])
        .pipe(filelog())
        .pipe(babel())
        .pipe(rename((file) => {
            // Remove .babel extension
            file.basename = file.basename.replace(/\.babel/gmi, '');
        }))
        .pipe(gulp.dest(setting.folder.dist.js));
});

Working

gulp.task('css', () => {
    console.info('-------GULP CSS -----');
    return gulp.src(`${setting.folder.src}**/*.scss`)
        .pipe(filelog())
        // Transpile Sass to CSS
        .pipe(sass({
            includePaths: [
                'node_modules',
                setting.folder.src
            ]
        }).on('error', sass.logError))
        .pipe(cssImport({
            includePaths: [
                'node_modules',
                setting.folder.src
            ]
        }))
        // Autoprefix
        .pipe(autoprefixer(setting.autoprefixer))
        .pipe(cleanCSS())
        // Writing to Dist folder
        .pipe(gulp.dest(setting.folder.dist.css))
        .pipe(browserSync.stream());
});

Answer 1

You could try this:

gulp.task('babel', (done) => {
    console.info('-------GULP BABEL -----');
    gulp.src([
        `${setting.folder.babelComponentPath}**/*.babel.js`
    ])
        .pipe(filelog())
        .pipe(babel())
        .pipe(rename((file) => {
            // Remove .babel extension
            file.basename = file.basename.replace(/\.babel/gmi, '');
        }))
        .pipe(gulp.dest(setting.folder.dist.js));
    done();
});

That is another way to signal async completion.