0

In my Gulpfile I have an issue, that I'll always get an error in the console:

[22:33:32] The following tasks did not complete: default, watch, watch:views, watch:styles, watch:scripts
[22:33:32] Did you forget to signal async completion?

But, as much as I see I just defined some watch tasks, nothing suspicious about it. So where's the error in gulp watch tasks?

gulp.task('reload', (done) => {
 browserSync.reload();

 done();
});

gulp.task('watch:views', () => {
 gulp.watch(getPath(paths.views.watch), gulp.series('lint', gulp.parallel('views', 'assets'), 'reload'));
});

gulp.task('watch:styles', () => {
 gulp.watch(getPath(paths.styles.all), gulp.series('lint', gulp.parallel('styles', 'assets'), 'reload'));
});

gulp.task('watch:scripts', () => {
 gulp.watch(getPath(paths.scripts.all), gulp.series('scripts', 'reload'));
});

gulp.task('watch', gulp.parallel('watch:views', 'watch:styles', 'watch:scripts'));

gulp.task('default', gulp.series(
 'clean',
 'lint',
 gulp.parallel(['views', 'styles', 'scripts', 'assets']),
 'serve',
 'watch',
));

Updated: The assets, styles and scripts task.

The tasks are defined as export default functions in other files. In the gulpfile they will be loaded and set as tasks. There is no problem calling these tasks by itself, they will do the correct signalisation of async completion. And the default task, which includes all this tasks, is running well. Just when the watch task starts it fails.

gulp.assets.js

import gulp from 'gulp';

import { paths, getPath, getTargetPath } from './paths';

export default () => {
  return gulp.src(getPath(paths.copy.src), {
    base: getPath(paths.copy.base)
  })
    .pipe(gulp.dest(getTargetPath(paths.target.assets)));
}

gulp.styles.js

import gulp from 'gulp';
import sass from 'gulp-sass';
import rename from 'gulp-rename';
import cleanCSS from 'gulp-clean-css';
import gulpif from 'gulp-if';

import { paths, getPath, getTargetPath } from './paths';
import { isProd } from './env';

export default () => {
  return gulp
    .src(getPath(paths.styles.main))
    .pipe(sass().on('error', sass.logError))
    .pipe(gulpif(isProd(), cleanCSS()))
    .pipe(rename({ dirname: '' }))
    .pipe(gulp.dest(getTargetPath(paths.target.assets)));
};

gulp.scripts.js

import gulp from 'gulp';
import browserify from 'browserify';
import source from 'vinyl-source-stream';
import buffer from 'vinyl-buffer';
import babelify from 'babelify';
import rename from 'gulp-rename';
import gulpif from 'gulp-if';
import uglify from 'gulp-uglify-es';

import { paths, getPath, getTargetPath } from './paths';
import { isProd } from './env';

export default () => {
  return browserify({
    entries: getPath(paths.scripts.main),
    debug: true,
    extensions: ['.js', '.jsx']
  })
  .transform(babelify.configure({
    presets: ["@babel/preset-env", "@babel/preset-react"]
  }))
  .bundle()
  .pipe(source('main.js'))
  .pipe(buffer())
  .pipe(gulpif(isProd(), uglify()))
  .pipe(rename({ dirname: '' }))
  .pipe(gulp.dest(getTargetPath(paths.target.assets)));
}
Marcel Bührig
  • 105
  • 2
  • 11
  • I think could be your 'script', 'styles' or 'assets' task. Could you share those? Have a look at [how to signify when a task is complete](https://gulpjs.com/docs/en/getting-started/async-completion) – Derek Nguyen Feb 08 '19 at 14:14
  • @DerekNguyen I've added the code blocks to the original post. But I think these tasks are not the problem, because they are called in the default task as well. And run without any problems. – Marcel Bührig Feb 11 '19 at 14:11
  • I found out when I take out the gulp:watch from the the gulp default task. It still fails, seems to be more a common probleme then just the watch task – Marcel Bührig Feb 11 '19 at 15:01

0 Answers0