Path is missing from source maps

[schlaup]

I tried your loader in a test project and found out that the path is missing from the source maps.

For example:

• App
  • Component
    • Page.jsx
    • Helper.ts

end up in Chrome as:

• App
  • Component
    • Page.jsx
• Helper.ts

I compared your loader with the jsx-loader and saw that the jsx-loader sets two additional properties on the sourcemap. (sources and files)

I changed your code and it works now: (basically a copy from jsx-loader)

...

    if (options.sourceMap) {
        var sourceFilename = loaderUtils.getRemainingRequest(this);
        var current = loaderUtils.getCurrentRequest(this);
        sourceMap = JSON.parse(output.outputFiles[0].text);
        sourceMap.sources = [sourceFilename];
        sourceMap.file = current;
        sourceMap.sourcesContent = [contents];
        contents = output.outputFiles[1].text;
    }

...

Does this look ok to you?

Could you incorporate this change in your code and npm module?

Thanks!

[jbrantly]

Hey thanks for doing all of the hard work on this! Sorry for the delay in implementing it. This is published in v0.3.2.

[schlaup]

Ok, thanks, I just discovered an additional problem:

Typescript places its own "//# sourceMappingURL=SomeFile.ts" in the JavaScript output.

So the bundle.js files ends up with multiple "# sourceMappingURL" declarations. (Of course, only the last "# sourceMappingURL=bundle.js.map" is valid)

It seems that Chrome does not care, but other tools do. (For example "NPM source-map-support")

The solution is to remove the redundant and incorrect "sourceMappingURL" declaration.

I added another line:

if (options.sourceMap) {
    var sourceFilename = loaderUtils.getRemainingRequest(this);
    var current = loaderUtils.getCurrentRequest(this);
    sourceMap = JSON.parse(output.outputFiles[0].text);
    sourceMap.sources = [sourceFilename];
    sourceMap.file = current;
    sourceMap.sourcesContent = [contents];
    contents = output.outputFiles[1].text;

This line here:

    contents = contents.replace("# sourceMappingURL=", " ");
}

This solves the problem.