Gulp does not work when returning stream

问题

The following Gulp setup does not work:

var templateCache = require("gulp-angular-templatecache");
var less = require("gulp-less");

gulp.task("angular-templates", function(){
      return gulp.src(TEMPLATES_SOURCES)
        .pipe(templateCache(TEMPLATES_JS, {module: "moonwalk", root: TEMPLATES_ROOT}))
        .pipe(gulp.dest("Temp/"));
});

gulp.task("less-compile",function(){
      return gulp.src("**/*.less")
        .pipe(less())
        .pipe(gulp.dest("./"));
});

gulp.task("release-assets", ["angular-templates", "less-compile"], function() {

    return gulp.src("./Content/**/*.cshtml")
        .pipe(gulp.dest("Dist/"));
});

When I run gulp release-assets the output is the following:

[01:24:06] Starting 'angular-templates'...
[01:24:06] Starting 'less-compile'...
[01:24:06] Finished 'angular-templates' after 605 ms

... not good ...

However if I change the second task by removing the return like this:

gulp.task("less-compile",function(){
       gulp.src("**/*.less")
        .pipe(less())
        .pipe(gulp.dest("./"));
});

Then the setup does work!? The output of gulp release-assets then is:

[01:21:54] Starting 'angular-templates'...
[01:21:54] Starting 'less-compile'...
[01:21:54] Finished 'less-compile' after 2.89 ms
[01:21:54] Finished 'angular-templates' after 741 ms
[01:21:54] Starting 'release-assets'...
[01:22:03] Finished 'release-assets' after 8.9 s

I do not understand that problem. I thought it was mandatory to return the stream that is provided by gulp.src()?

Can somebody explain, why the above setup is not working if I return on gulp.src()?

回答1:

So the main points raised in the comments; return doesn't seem like it is throwing off gulp; you are using the latest version of gulp-less, and your tasks look OK from a syntax standpoint.

The main takeaway from this is that project structure is quite important, so that when you specify a glob such as **/*.less you have to be aware of what files it can match; in this case the glob is far too greedy and will match things in node_modules that may or may not be relevant to your project. Because gulp.src is an expensive operation, it is a good practice to organise your source files into directories and limit glob's scope to be within those directories.

A better glob pattern would be something along the lines of ./lib/styles/**/*.less - that way you have both scoped the glob appropriately and you also keep your less files in one place. Your gulp task should therefore look something like the following:

gulp.task("less-compile", function () {
    return gulp.src("./lib/styles/**/*.less")
        .pipe(less())
        .pipe(gulp.dest("./dist/css"));
});

回答2:

I had a similar problem, and solved it by changing the installed gulp version from 3.8.7 to 3.8.5 in package.json:

  "devDependencies": {
    "gulp": "3.8.5"
  }

Must be a change or error in the newer version preventing the pipe(gulp.src('.')) from resolving the return statement.

来源：https://stackoverflow.com/questions/27789367/gulp-does-not-work-when-returning-stream

标签

gulp