如何使js.map文件与UMD模块一起使用?

时间:2018-06-19 15:03:37

标签: javascript typescript google-chrome-devtools firefox-developer-tools

我有以下TS文件:

MapTest

module Test
{
    export function myTest() {
        const zero = 0;
        const two = zero + 2;
        const four = two + two;
        const six = four + two;
        console.log(six);
    }
}

MapModuleTest.ts

export module Test
{
    export function myTest() {
        const zero = 0;
        const two = zero + 2;
        const four = two + two;
        const six = four + two;
        console.log(six);
    }
}

当我尝试在Chrome或FireFox中设置断点并调试MapTest的TypeScript时,一切正常。当我尝试调试MapModuelTest.ts时,Chrome和Firefox中的TypeScript行似乎比实际的JS领先两行。因此,如果我在此行const six = four + two;上设置一个断点,则它的作用就好像JS实际上在此行const two = zero + 2;上中断(即,zero被定义为0twoundefined

这是一个已知的错误吗? UMD生成是否需要一些其他内容才能正确使用.map文件?

调试器窗口更加有趣,因为本地窗口与控制台不匹配。 enter image description here

以下是相关的JS和Map文件

MapTest.js

var Test;
(function (Test) {
    function myTest() {
        var zero = 0;
        var two = zero + 2;
        var four = two + two;
        var six = four + two;
        console.log(six);
    }
    Test.myTest = myTest;
})(Test || (Test = {}));
//# sourceMappingURL=MapTest.js.map

MapTest.js.map

{"version":3,"file":"MapTest.js","sourceRoot":"","sources":["MapTest.ts"],"names":[],"mappings":"AAAA,IAAO,IAAI,CASV;AATD,WAAO,IAAI;IAEV;QACC,IAAM,IAAI,GAAG,CAAC,CAAC;QACf,IAAM,GAAG,GAAG,IAAI,GAAG,CAAC,CAAC;QACrB,IAAM,IAAI,GAAG,GAAG,GAAG,GAAG,CAAC;QACvB,IAAM,GAAG,GAAG,IAAI,GAAG,GAAG,CAAC;QACvB,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAClB,CAAC;IANe,WAAM,SAMrB,CAAA;AACF,CAAC,EATM,IAAI,KAAJ,IAAI,QASV"}

MapModuleTest.js

(function (factory) {
    if (typeof module === "object" && typeof module.exports === "object") {
        var v = factory(require, exports);
        if (v !== undefined) module.exports = v;
    }
    else if (typeof define === "function" && define.amd) {
        define(["require", "exports"], factory);
    }
})(function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var Test;
    (function (Test) {
        function myTest() {
            var zero = 0;
            var two = zero + 2;
            var four = two + two;
            var six = four + two;
            console.log(six);
        }
        Test.myTest = myTest;
    })(Test = exports.Test || (exports.Test = {}));
});
//# sourceMappingURL=MapModuleTest.js.map

MapModuleTest.js.map

{"version":3,"file":"MapModuleTest.js","sourceRoot":"","sources":["MapModuleTest.ts"],"names":[],"mappings":";;;;;;;;;;;IAAA,IAAc,IAAI,CASjB;IATD,WAAc,IAAI;QAEjB;YACC,IAAM,IAAI,GAAG,CAAC,CAAC;YACf,IAAM,GAAG,GAAG,IAAI,GAAG,CAAC,CAAC;YACrB,IAAM,IAAI,GAAG,GAAG,GAAG,GAAG,CAAC;YACvB,IAAM,GAAG,GAAG,IAAI,GAAG,GAAG,CAAC;YACvB,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;QAClB,CAAC;QANe,WAAM,SAMrB,CAAA;IACF,CAAC,EATa,IAAI,GAAJ,YAAI,KAAJ,YAAI,QASjB"}

1 个答案:

答案 0 :(得分:0)

我已将其记录为错误。希望可以解决此问题:

https://github.com/Microsoft/TypeScript/issues/25079