Question

我创建了一个gulp / typescript工作流程，可以执行以下操作。

gulp.watch（..）
吞-打字稿
吞掉-丑化
吞-sourcemaps

使用以下内容..

var tsProject = ts.createProject('tsconfig.json') // See below for options

gulp.task('watch-ts', function () {
    return gulp.watch(paths.scriptSrc + '/**/*.ts', ['compile-ts']);
});

gulp.task('compile-ts', function () {
    var tsResult = gulp
        .src(paths.scriptSrc + '/**/*.ts')
        .pipe(sourcemaps.init())
        .pipe(ts(tsProject));

    return tsResult
        .js
        .pipe(uglify())
        .pipe(sourcemaps.write('./'))
        .pipe(gulp.dest(paths.scripts));
});

{
    "compilerOptions": {
        "outFile": "app.js",
        "target": "es5",
        "removeComments": true,
        "noImplicitAny": false,
        "module": "system",
        "experimentalDecorators": true,
        "declaration": false,
        "noEmitOnError": true
    }
}

所以在创建了js文件+源代码之后，当我尝试使用Chrome调试器进入并调试我的一个打字稿文件时，断点会跳到整个地方，每一个F10的一行跳转到一些随机行按。我相信在生成源图时会发生一些奇怪的事情，但不知道是什么。

如果我发表评论＆＃34; .pipe（uglify（））＆＃34;然后我可以完美地调试，没有任何问题。

有谁知道可能导致此行为的原因是什么？

Answer 1

uglify插件会删除你的js-code，但不会更改源图。因此，源映射提供的映射不再与您的实际js文件匹配。

大多数uglify-plugins都有自己生成源图的选项，所以你可以试试。

我建议有两个不同的构建任务。一个用于开发，它不会破坏您的代码并发出源代码，而是一个用于生成的代码，它会使您的代码变得丑陋，但不会发出源代码映射。

在gulp-uglify之后，typescript sourcemaps错误

1 个答案: