Gulp task not waiting the completion of the previous task

1.6k views Asked by At

I have a gulp task that uses streams to write a revised file (using gulp-rev) and another task that uses the previously written manifest file for replacing a variables in an html file.

My first task:

gulp.task('scripts', function() {
  // other stuff...
  var b = browserify(mainscript);
  b.external('External')
    .transform(babelify)
    .bundle()
    .pipe(source('app.js'))
    .pipe(buffer())
    .pipe(rev())
    .pipe(gulp.dest(dest))
    .pipe(rev.manifest({
      path: 'appjs-manifest.json'
    }))
    .pipe(gulp.dest(dest))
}

The previous task, will write a file named something like 'app-34f01b9d.js' and a manifest file 'appjs-manifest.json' containing:

{
  "app.js": "app-34f01b9d.js"
}

My second task, theoretically, should wait the completion of the first task before starting :

gulp.task('renameindex',['scripts'], function () {
    var paths = gulp.paths;
    var jsonContent = JSON.parse(fs.readFileSync(paths.buildDest+'/public/scripts/appjs-manifest.json', 'utf8'));
    var src=paths.srcDir+"/index.hbs";
    var appjs=jsonContent["app.js"];
    console.log("app.js",appjs)
    return gulp.src(src)
            .pipe(handlebars({appjs:appjs}, null))
            .pipe(rename('index.html'))
            .pipe(gulp.dest(paths.buildDest));

});

The tasks should read the manifest file and replace "app-34f01b9d.js" to a variable {appjs}} in an handlebar template generating a file "index.html".

What happens is that the javascript file and the manifest file are written correctly but the second task executes without waiting for the manifest file to be written thus grabbing the wrong manifest file content (the one of the previous execution).

1

There are 1 answers

1
Mo Valipour On BEST ANSWER

Your scripts task is not returning any value. When you do not return anything gulp have no way to know when the task is finished, therefore continues to the next one.

simply say

gulp.task('scripts', function() {
  // other stuff...
  var b = browserify(mainscript);
  return b.external('External')
    ...

In case your task is doing something other than a gulp pipe line, you can manually call the callback which is passed to the task as a parameter:

gulp.task('someTask', function(done) {
...
done();
}