strange syntax error with gulp-rev

Question

I have a weird problem using gulp-rev after gulp-useref. I am using gulp-useref to concatenate all my angular, jquery, etc. into a file called lib.js.

This works fine, but if I use gulp-rev to append the hash to the lib.js filename, visual studio and browsers complain about a syntax error in the file.

(FWIW, the statement it's complaining about is 'e.querySelectorAll("*,:x")' which came from jquery.js). But if I comment out the .pipe($.rev()) line in my gulp task, it all works.

However, when I compare lib.js and lib-3654837183.js using MD5 or any hashing algo, they are exactly the same. So why would browsers and VS complain about syntax errors for a file with one name and be totally fine with the same file but with a different name?

gulp.task("build-prod", ["inject"], function() {
    log("building production environment");
    var cssFilter = $.filter("**/*.css", { restore: true });
    var htmlFilter = $.filter("**/*.cshtml", { restore: true });
    var jsLibFilter = $.filter("**/" + config.optimized.lib, { restore: true });
    var jsAppFilter = $.filter("**/" + config.optimized.app, { restore: true });

    return gulp
        .src(config.layout.devFile)
        .pipe($.plumber())
        .pipe($.print())
        .pipe($.useref({ searchPath: "./" }))
        .pipe(cssFilter)
        .pipe($.minifyCss({ processImport: false }))
        .pipe($.rev())
        .pipe(gulp.dest(config.root))
        .pipe(cssFilter.restore)
        .pipe($.print())
        .pipe(jsLibFilter)
        .pipe($.uglify())
        .pipe($.rev()) //if I comment this out, it works
        .pipe(gulp.dest(config.root))
        .pipe(jsLibFilter.restore)
        .pipe(jsAppFilter)
        .pipe($.ngAnnotate())
        .pipe($.uglify())
        .pipe($.rev())
        .pipe(gulp.dest(config.root))
        .pipe(jsAppFilter.restore)
        .pipe($.revReplace({ replaceInExtensions: [".cshtml"] }))
        .pipe(htmlFilter)
        .pipe($.rename(config.layout.productionFileName))
        .pipe(gulp.dest(config.sharedViews));
});

And my build block in the .cshtml:

<!-- build:js js/lib.js -->
<!-- bower:js -->
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
<!-- endbower -->
<!-- endbuild -->

Any ideas?

Marcus

Answer 1

It seems I was chasing a red herring. The concatenated file called plain lib.js was still throwing an exception; I just wasn't seeing it as I hadn't "included lib.js in the project" in VS. When I disabled breaking when thrown for "Exception thrown from Javascript" in Exception Settings in Visual Studio, things worked just fine.

It seems the exception is a well-known one for Internet Explorer: https://bugs.jquery.com/ticket/13881

Sorry about the noise.