How can I generate valid Source Maps with Gulp, Uglify & Concat?

Question

Has anyone found a working combination of Gulp, Uglify and Concat that generates a valid source map? There appears to be lots of issues in GitHub regarding these sorts of interactions, but equally people appear to have found combinations that work successfully. I've tried numerous variations, but the moment I turn on uglify the symbol mapping does not work and breakpoints don't work correctly in the browser. As an example, the following works fine:

return gulp.src('/scripts/*.js')
            .pipe(sourcemaps.init())
            //.pipe(uglify())
            .pipe(concat(outputName + '.min.js'))
            .pipe(sourcemaps.write('./'))
            .pipe(gulp.dest(outputPath))
            .on('end', function() { gutil.log('Minified ' + outputName); })
            .on('error', handleError);

but uncomment uglify and it doesn't.

I have created a GitHub repo to reproduce the issue: https://github.com/jamescrowley/gulpIssues

Answer 1

We've been using it as:

.pipe(sourcemaps.init())
.pipe(concat('app.js'))
.pipe(ngAnnotate())
.pipe(uglify())
.pipe(sourcemaps.write())
.pipe(gulp.dest('app.js'))

And that seems to work fine for me. It outputs the sourcemaps into the file itself though.

Versions:

"browser-sync": "^2.2.4",
    "gulp": "^3.8.6",
    "gulp-concat": "^2.3.4",
    "gulp-ng-annotate": "^0.2.0",
    "gulp-rename": "^1.2.0",
    "gulp-replace": "^0.4.0",
    "gulp-sourcemaps": "^1.1.0",
    "gulp-uglify": "^0.3.1",
    "gulp-util": "^2.2.20"