Node.js 一口注入一口翡翠

这是我使用gulp的第一天-我尝试使用gulp inject将应用程序文件夹中的一些脚本文件和转换为html的jade文件放入“临时”文件夹，该文件夹使用webserver提供html。如果我只使用静态html，我可以让它正常工作，但当我切换到jade时，它只在我第一次运行gulp后才工作（我猜是因为它仍然在第一次处理gulp jade“jade（）”，所以没有要注入的html，所以我有这段代码（当然，我已经完成了一半的教程，所以这可能不是使用gulp的正确方法，但教程中没有使用我更喜欢的jade）

---

您应该将您的gulp任务分为两个任务，并使用gulp依赖项确保在其他任务开始之前运行并完成一个任务

var gulp = require('gulp');
var server = require('gulp-webserver');
var jade = require('gulp-jade');
var inject = require('gulp-inject');

var paths = {
  app: 'app/**/*.js',
  bower: 'bower_components',
  jade: 'app/*.jade',
  temp: 'temp',
  tempVendor: 'temp/vendor',
  index: 'temp/index.html'
}

gulp.task('default', ['scripts']);

gulp.task('jade', function() {
    return gulp.src(paths.jade)
    .pipe(jade())
    .pipe(gulp.dest(paths.temp));
});

gulp.task('scripts', ['jade'], function(){ 
    var appFiles = gulp.src(paths.app).pipe(gulp.dest(paths.temp));
    var vendor = gulp.src(mainBower()).pipe(gulp.dest(paths.tempVendor));

    gulp.src(paths.index)
      .pipe(inject(scripts,{relative:true}))
      .pipe(inject(vendor, {relative:true, name: 'vendorinject'}))
      .pipe(gulp.dest(paths.temp));
});

这样，脚本任务只会在jade任务完成后运行和注入

var gulp = require('gulp');
var server = require('gulp-webserver');
var jade = require('gulp-jade');
var inject = require('gulp-inject');

var paths = {
  app: 'app/**/*.js',
  bower: 'bower_components',
  jade: 'app/*.jade',
  temp: 'temp',
  tempVendor: 'temp/vendor',
  index: 'temp/index.html'
}

gulp.task('default', ['scripts']);

gulp.task('jade', function() {
    return gulp.src(paths.jade)
    .pipe(jade())
    .pipe(gulp.dest(paths.temp));
});

gulp.task('scripts', ['jade'], function(){ 
    var appFiles = gulp.src(paths.app).pipe(gulp.dest(paths.temp));
    var vendor = gulp.src(mainBower()).pipe(gulp.dest(paths.tempVendor));

    gulp.src(paths.index)
      .pipe(inject(scripts,{relative:true}))
      .pipe(inject(vendor, {relative:true, name: 'vendorinject'}))
      .pipe(gulp.dest(paths.temp));
});