调试变量不适用于gulp源映射+ uglify [英] Debugging variables not working with gulp sourcemaps + uglify

问题描述

我有以下gulp任务来捆绑javascript:

I have the following gulp task for bundling javascript:

gulp.task('js', function () {
    return gulp.src(paths.js)
        .pipe(sourcemaps.init())
        .pipe(uglify())
        .pipe(concat('bundle.min.js'))
        .pipe(sourcemaps.write('./'))
        .pipe(gulp.dest('dist'));
});

当我在Chrome开发工具中运行此代码时，会找到源映射并且可以使用断点，但但是无法调试变量.

When I run this in the Chrome dev tools, sourcemaps are found and breakpoints work, but variables can't be debugged.

以以下示例角度代码为例:

Take this example chunk of angular code:

iarApp.config(['$animateProvider', function ($animateProvider) {
    $animateProvider.classNameFilter(/angular-animate/);
}]);

如果添加一个断点以查看$animateProvider的值，则会得到以下信息:

If I add a breakpoint to see the value of $animateProvider, I get the following:

但是，如果我在Uglify中关闭变量处理:

But if I turn off variable mangling in Uglify:

.pipe(uglify({ mangle: false }))

然后它起作用了

因此，在Uglify修改名称之后，似乎gulp-sourcemaps插件无法跟踪变量.

So it seems that the gulp-sourcemaps plugin can't follow up variables after Uglify mangles the names.

其他任何人都能遇到同样的问题和/或知道解决方案吗?

Can anyone else get the same issue and/or know a solution?

推荐答案

由于目前这不是源地图规范的一部分，因此目前尚无法解决.

Turns out this is just not possible currently, since this is not part of the specification for source maps.

有一些 建议到

There are some proposals to add this feature, so we will have to wait until the spec and implementations are updated.

这篇关于调试变量不适用于gulp源映射+ uglify的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！