返回流时，Gulp不起作用 [英] Gulp does not work when returning stream

问题描述

  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 /））; 
}）; 
 $ b gulp.task（less-compile，function（）{
 return gulp.src（** / *。less）
 .pipe（less（） ）
 .pipe（gulp.dest（./））; 
}）; 
 $ b gulp.task（release-assets，[angular-templates，less-compile]，function（）{
 
 return gulp.src（ ./Content/**/*.cshtml）
 .pipe（gulp.dest（Dist /））; 
}）; 
  

当我运行 gulp release-assets 时，输出如下：

  [01:24:06]启动'angular-templates'... 
 [ 01:24:06]启动'less-compile'... 
 [01:24:06] 605 ms后完成'angular-templates'
  

...不好... ...

然而，如果我通过移除<$ c

$ g $ p $ g $ p $ g $ g $ g $ p $ g $ g $ g $ g $ g $ g $ gp $ ）{
gulp.src（** / *。less）
.pipe（less（））
.pipe（gulp.dest（./））;
}）;

然后安装程序工作！？ gulp release-assets 的输出是：

  [01： 21:54]启动'angular-templates'... 
 [01:21:54]启动'less-compile'... 
 [01:21:54]完成'less-compile'在2.89 ms后
 [01:21:54] 741 ms完成'angular-templates'
 [01:21:54]启动'release-assets'... 
 [01： 22:03] 8.9秒后完成'release-assets'
  

我不明白这个问题。我认为这是 return 由 gulp.src（）？

提供的流b
$ b

有人可以解释，为什么上面的设置不起作用，如果我返回 gulp.src（）？

解决方案

所以在评论中提出的主要观点; return 似乎并不像是在呕吐;您正在使用最新版本的gulp-less，并且从语法角度来看，您的任务看起来不错。

从这个角度来看，项目结构是非常重要的，所以当你指定一个glob如 ** / *。less 你必须知道它可以匹配哪些文件;在这种情况下，glob非常贪婪，并且会匹配 node_modules 中可能与您的项目相关或不相关的内容。因为 gulp.src 是一个昂贵的操作，所以将源文件组织到目录并限制 glob 在这些目录中。

一个更好的glob模式应该是 ./ lib / styles / ** / * .less - 这样你就可以适当地确定glob的范围，并且你还可以将更少的文件放在一个地方。因此，您的大量任务应该如下所示：

  gulp.task（less-compile，function（）{
返回gulp.src（./ lib / styles / ** / *。less）
 .pipe（less（））
 .pipe（gulp.dest（./ dist / css））; 
}）; 
  

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()?

解决方案

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"));
});

这篇关于返回流时，Gulp不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！