gulp-rev-replace icon indicating copy to clipboard operation
gulp-rev-replace copied to clipboard

if manifest is written after rev and before inject, replace doesn't happen

Open johnpapa opened this issue 9 years ago • 1 comments

Why would that happen?

gulp.task('injectfiles',
    ['js', 'vendorjs', 'css', 'vendorcss'], function () { // these tasks create the minified 4 css and js files
    log('Building index.html to stage');

    var minified = pkg.paths.stage + '**/*.min.*';
    var index = pkg.paths.client + 'index.html';

    var minFilter = plug.filter(['**/*.min.*', '!**/*.map']);
    var indexFilter = plug.filter(['index.html']);

    return gulp
        .src([].concat(minified, index)) // add all staged min files and index.html
        .pipe(minFilter) // filter the stream to minified css and js
        .pipe(plug.rev()) // create files with rev's
        .pipe(gulp.dest(pkg.paths.stage)) // write the rev files
// if we create and write rev.manifest here, replace doesn't happen.
        .pipe(minFilter.restore()) // remove filter, back to original stream
        .pipe(indexFilter) // filter to index.html
        .pipe(inject('content/vendor.min.css', 'inject-vendor'))
        .pipe(inject('content/all.min.css'))
        .pipe(inject('vendor/vendor.min.js', 'inject-vendor'))
        .pipe(inject('all.min.js'))
        .pipe(indexFilter.restore()) // remove filter, back to original stream
        .pipe(plug.revReplace())         // Substitute in new filenames
        .pipe(gulp.dest(pkg.paths.stage)) // write the index.html file changes
        .pipe(plug.rev.manifest()) // create the manifest (must happen last or we screw up the injection)
        .pipe(gulp.dest(pkg.paths.stage)); // write the manifest

    function inject(path, name) {
        var glob = pkg.paths.stage + path
        var options = {
            ignorePath: pkg.paths.stage.substring(1),
            read: false
        };
        if (name) { options.name = name; }
        return plug.inject(gulp.src(glob), options);
    }
});

johnpapa avatar Sep 02 '14 05:09 johnpapa

@johnpapa doesn't that line:

.pipe(gulp.dest(pkg.paths.stage)) // write the index.html file changes

... write out all the files in the (at that very moment unfiltered) stream instead of only index.html .. unnecessarily writing over the files already written by

.pipe(gulp.dest(pkg.paths.stage)) // write the rev files

... which gets executed at an earlier point of time in your pipe?

Applying some of your lessons from the pluralsight gulp.js course, I currently got kinda stuck with a similar issue:

gulp.task( 'rev', function () {
  var filesToRevision = [
    config.frontend + config.jsBuildMainFile,
    config.frontend + config.jsBuildLibFile,
    config.frontend + config.stylesBuildFile
  ];
  var filesToRevisionFilter = $.filter([
    config.jsBuildMainFile,
    config.jsBuildLibFile,
    config.stylesBuildFile
  ]);
  var filesToReplaceWithin = [
    config.frontend + config.htmlBuildFile,
    config.frontend + 'bootstrap.js'
  ];
  //var filesToReplaceWithinFilter = $.filter([
  //  config.htmlBuildFile,
  //  'bootstrap.js'
  //]);

  return gulp.src( filesToRevision.concat( filesToReplaceWithin ))
  .pipe( filesToRevisionFilter )
  .pipe( $.rev())
  .pipe( filesToRevisionFilter.restore())
  // TODO: why is gulp-rev-replace not working inside another filter ??
  //.pipe( filesToReplaceWithinFilter )
  .pipe( $.revReplace())
  //.pipe( filesToReplaceWithinFilter.restore())
  .pipe( gulp.dest( config.buildFolder ));
});

Does someone know why rev-replace isn't working inside another filter? The code above is working but rev-replace is substituting in the filenames containing the revision during the second gulp.dest not only in filesToReplaceWithin (e.g. index.html) but in filesToRevision itself as well.

There might be cases when you exactly want to do this. But I guess in general, except the file names, you'd want to have those file's contents untouched.

Any help would be appreciated.

andreasgrimm avatar Feb 08 '15 02:02 andreasgrimm