All 10 Debugging, Testing & Tooling questions
More in Debugging, Testing & Tooling
What is console.table() useful for? What is a unit test and what makes a good one? How does Jest's mocking help isolate the code under test? What is code coverage and why isn't 100% coverage the same as bug-free code? How do you write an effective test for asynchronous code? What is snapshot testing and what's a common pitfall with it? How does the Performance panel in DevTools help diagnose a janky UI? What's the difference between end-to-end (E2E) tests and unit tests, and when do you use each?
Advertisement
Back to results for “Debugging”
JavaScript › Debugging, Testing & Tooling

How does source mapping help when debugging minified or transpiled code?

Intermediate

Answer

A source map is a file that maps positions in generated (minified/transpiled) code back to the original source, so browser DevTools can show you readable original code and correct line numbers even though the browser is actually running the bundled output.
//# sourceMappingURL=app.min.js.map
// tells DevTools where to find the mapping file
Real-world example Debugging a production error stack trace that points to original TypeScript source, not the minified bundle.

Common follow-ups: Why should source maps typically not be publicly exposed on production servers?

ES Modules
All 10 Debugging, Testing & Tooling questions