build - Gulp + sourcemaps 如何进行调试

Question

所以我昨天刚开始使用 Gulp，在经历了一个艰难的开始之后，我正在努力实现构建过程的自动化，但我决定尝试做一些稍微有点棘手的事情，然后突然撞到了另一面墙。

我想要的输出是有一个缩小的 javascript 文件，我可以将它提供给浏览器，并在 Chrome 或 Firefox 中检查后，查看原始源代码。很简单，对吧？

我目前在我的 gulpfile 中有以下内容：

gulp.task('minify', function() {
    gulp.src('./sources/**/*.js')
    .pipe(sourcemaps.init())
    .pipe(minify({
        ext:{
            src:'.js',
            min:'.min.js'
        }
    }))
    .pipe(sourcemaps.write('maps'))
    .pipe(gulp.dest('./www/js'));
});

这会成功生成源映射，./www/js/maps/并将以下内容放在未压缩文件的底部：

//# sourceMappingURL=maps/<whatever>.js.map

但是，它不会将此类注释附加到压缩文件的底部。因此，当我在浏览器中打开这些文件时，它无法显示原始来源。

我究竟做错了什么？

Answer 1

你可以试试这个：

gulp.task('minify', function() {
    gulp.src('./sources/**/*.js')
    .pipe(sourcemaps.init())
    .pipe(minify({
        ext:{
            src:'.js',
            min:'.min.js'
        }
    }))
    .pipe(sourcemaps.write('maps', {
      addComment: true
    }))
    .pipe(gulp.dest('./www/js'));
});