johnpapa/generator-hottowel

Warning: you will need to rewrite gulpfile.js if you upgrade to gulp-useref v3.x

Opened this issue · 8 comments

There's an API change in gulp-useref which breaks the optimize pipe in _gulpfile.js if you upgrade gulp-useref.

See jonkemp/gulp-useref#153

TueCN commented

I made the following changes to the 'optimize' task to accomodate gulp-useref 3.x.x
Note: I also generate source maps - which the old optimize task didn't do!

Please let me know if you spot any errors or have suggestions for improvements.
Maybe I should make a pull request with the changes?

/**
 * Optimize all files, move to a build folder,
 * and inject them into the new index.html
 * @return {Stream}
 */
gulp.task('optimize', ['inject', 'test'], function () {
    log('Optimizing the js, css, and html');

    // Filters are named for the gulp-useref path
    var cssFilter = $.filter('**/*.css');
    var jsAppFilter = $.filter('**/' + config.optimized.app);
    var jslibFilter = $.filter('**/' + config.optimized.lib);
    var notIndexFilter = $.filter(['**/*', '!**/index.html']);

    var templateCache = config.temp + config.templateCache.file;

    return gulp
        .src(config.index)
        .pipe($.plumber())
        .pipe(inject(templateCache, 'templates'))
        // Apply the concat and file replacement with useref
        .pipe($.useref({searchPath: './'}, lazypipe().pipe($.sourcemaps.init, {loadMaps: true})))
        // Get the css
        .pipe(cssFilter)
        .pipe($.minifyCss())
        .pipe(cssFilter.restore())
        // Get the custom javascript
        .pipe(jsAppFilter)
        .pipe($.ngAnnotate({add: true}))
        .pipe($.uglify())
        .pipe(getHeader())
        .pipe(jsAppFilter.restore())
        // Get the vendor javascript
        .pipe(jslibFilter)
        .pipe($.uglify()) // another option is to override wiredep to use min files
        .pipe(jslibFilter.restore())
        // Take inventory of the file names for future rev numbers
        .pipe(notIndexFilter)
        .pipe($.rev())
        .pipe(notIndexFilter.restore())
        // Replace the file names in the html with rev numbers
        .pipe($.revReplace())
        .pipe($.sourcemaps.write('.'))
        .pipe(gulp.dest(config.build));
});

Did you check if your version ends up adding a revision number to index.html? I solved the issue slightly different than you, so I am not sure if your solution will have the same issue mine had.

@TueCN worked well, thank you 👍

any suggested changes for this repo? a PR?

@johnpapa , I use gulp-if to not revision the index.html, please take a look here

@TueCN, could you make a PR with your suggested change? I'm the OP, but don't know enough about writing gulp files to write anything useful.

TueCN commented

@johnpapa @rwillmer
Hope you can use the PR #177, let me know :)

if someone wants to hit this, i'll review