简体   繁体   English

如何让 js.map 文件与 UMD 模块一起工作?

[英]How to Get js.map Files to Work With UMD Modules?

I have the following TS Files:我有以下 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 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);
    }
}

When I attempt to set break points and debug the TypeScript for MapTest in either Chrome or FireFox, everything works as expected.当我尝试在 Chrome 或 FireFox 中为MapTest设置断点和调试 TypeScript 时,一切都按预期进行。 When I attempt to debug MapModuelTest.ts , the TypeScript line appears to be two lines ahead in both Chrome and Firefox than the actual JS.当我尝试调试MapModuelTest.ts ,Chrome 和 Firefox 中的 TypeScript 行似乎比实际的 JS 提前两行。 So if I put a breakpoint on this line const six = four + two;因此,如果我在这一行上放置一个断点const six = four + two; it acts as if the JS is actually breaking on line this line const two = zero + 2;它的作用就好像 JS 实际中断了这一行const two = zero + 2; (ie zero is defined to be 0 , but two is undefined ) (即zero被定义为0 ,但two undefined

Is this a known bug?这是一个已知的错误? Does UMD generation need something different in order to work correctly for .map files? UMD 生成是否需要不同的东西才能正确处理 .map 文件?

The debugger window is even more interesting in that the local does not match the console.调试器窗口更有趣,因为本地与控制台不匹配。 在此处输入图片说明

Here are the related JS and Map files这里是相关的JS和Map文件

MapTest.js地图测试.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地图测试.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 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 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"}

I've logged this as a bug.我已将此记录为错误。 Hopefully this can get fixed:希望这可以得到解决:

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

Update更新

This appears to have been an issue with the es6-promise library I was using to pollyfill promises.这似乎是我用来 pollyfill 承诺的 es6-promise 库的一个问题。 Once I switched to something something >= es6 for my compiling, the mapping worked correctly.一旦我切换到 >= es6 的东西进行编译,映射就可以正常工作。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM