How do I make sourcemaps work with typescript?

[rikimaru0345]

Hi,

I created a project using npx create-react-app my-app --template typescript and then created a build with npm run build.

When an exception occurs I get a stack trace like this for example:

Ei@https:// my-url/static/js/2.ce0f66d0.chunk.js:2:1231151
ji/<@https:// my-url/static/js/2.ce0f66d0.chunk.js:2:1236039
Ta@https:// my-url/static/js/2.ce0f66d0.chunk.js:2:1245521
...

In order to find the issue I used this tool: https://www.npmjs.com/package/source-map-cli

source-map resolve frontend/build/static/js/2.ce0f66d0.chunk.js 2 1231151

However, that shows the code region of the compiled .js code (seemingly the output of the typescript compiler).
While its not as bad as the minified code webpack created, it's still pretty bad.

• How do I get the stack trace that refers to the acutal source files? (.ts/.tsx)

• What tool would I use for that? Is source-map-cli the correct one, or is there a tool specifically for typescript?

• Do I need to do some sort of "double decoding"? Like decoding from webpack-minified-js => compiled typescript output, and then another decoding step to get from the typescript output to the actual typescript files?