Objective
Create a gulp.watch task to run others tasks in a specific order
Why this is not a duplicate
Many people have suggested I take a look at How to run Gulp tasks sequentially one after the other. However, this question focuses on gulp.task while my question focuses on gulp.watch.
The solution I am searching is a way to use gulp.watch to achieve the synchronous effect I am after. If this is not possible however, I will fall-back to gulp.task.
Background
I have a small project, I have some test files as well as the the gulp gulp-complexity plugin. I wish to run the test files first, and then run the gulp-complexity plugin every time a JavaScript file is changed.
What I have tried
I read the documentation and saw the following tutorials:
- https://github.com/gulpjs/gulp/blob/master/docs/API.md
- https://www.smashingmagazine.com/2014/06/building-with-gulp/
They were very good, but I still don't understand how I can have a gulp.watch task that runs tasks in synchronously (in a specific order) instead of running them asynchronously.
Code
This is what I got so far:
var gulp = require("gulp");
var mocha = require("gulp-mocha");
var complexity = require("gulp-complexity");
gulp.task("test", function(){
gulp
.src("./test.js")
.pipe(mocha())
.on("error", function(){
this.emit("end");
});
});
gulp.task("complexity", ["test"], function(){
gulp.src('*.js').pipe(complexity());
});
gulp.task("watch", function(){
gulp.watch("./*.js", ["test", "complexity"]);
});
What am I doing wrong here?
Please bare in mind I am still very new to gulp (started learning it today!) so any explanations on my problem would be welcome!
