Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Source maps mapping looks wrong when using Webpack #498

Open
eloparco opened this issue Nov 26, 2023 · 2 comments
Open

Source maps mapping looks wrong when using Webpack #498

eloparco opened this issue Nov 26, 2023 · 2 comments

Comments

@eloparco
Copy link

Hello,
I've been experimenting with this repository. I tried to generate a simple project to use source maps using Webpack: https://github.com/eloparco/test-source-maps, where I produce a js bundle starting from Typescript and I want to use source maps for the mapping between the two.

I tried to play around with the generated source maps:

const SourceMapConsumer = require("source-map").SourceMapConsumer;
const fs = require("fs");

const SOURCEMAP_ABSOUTE_PATH = "/path/to/test-source-maps/dist/bundle.js.map";
const ORIGINAL_ABSOLUTE_PATH = "/path/to/test-source-maps/src/index.ts";
const GENERATED_ABSOLUTE_PATH = "/path/to/test-source-maps/dist/bundle.js";
const ORIGINAL_LINE = 11;

let json = JSON.parse(fs.readFileSync(SOURCEMAP_ABSOUTE_PATH).toString());

SourceMapConsumer.with(json, null, (consumer) => {
  console.log(consumer.sources);

  const generated = consumer.generatedPositionFor({
    source: ORIGINAL_ABSOLUTE_PATH,
    line: ORIGINAL_LINE,
    column: 0,
  });
  console.log(generated);

  const original = consumer.originalPositionFor({
    line: generated.line,
    column: generated.column,
  });
  console.log(original);

  assert(original.line === ORIGINAL_LINE); // <------------ This assertion fails!!!
});

Here I use generatedPositionFor() to get the mapping from the original .ts file to the corresponding .js file. Then, I try to do the opposite and feed the line and column previously retrieved to originalPositionFor(), expecting it to return the original line/column that I passed to generatedPositionFor(). But that doesn't happen.

Is my understanding of source maps wrong? Or am I doing something wrong in the Webpack configuration?
Thanks

@eloparco
Copy link
Author

I found out that the problem has something to do with webpack.
If I add "sourceMap": true, to tsconfig.json and run tsc instead of webpack, I get what I was expecting.

@eloparco
Copy link
Author

eloparco commented Nov 27, 2023

Even when using tsc (with webpack instead it was minifying the generated source and it was causing issues), the mapping is not always correct. Is there a recommended way (or even better, an example project) to generate the source file and source map in a format that is compatible with this library?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant