Source Map

ELI5 — The Vibe Check

Source maps are the translation files that let your browser's DevTools show you the original, readable source code even though the browser is actually running minified, bundled garbage. Without source maps, debugging production errors means deciphering code like 'function a(b){return b.c.d()}'. With source maps, you see your actual file and line numbers.

Real Talk

Source maps are files that map minified or transpiled code back to the original source. They are generated by bundlers and compilers and referenced via a comment at the end of compiled files (//# sourceMappingURL=). Browser DevTools use source maps to display original source, set meaningful breakpoints, and show accurate stack traces.

Show Me The Code

// End of minified bundle.js
//# sourceMappingURL=bundle.js.map

// vite.config.js — control source map generation
export default {
  build: {
    sourcemap: true  // 'hidden' for production (Sentry-only)
  }
}

When You'll Hear This

Upload source maps to Sentry to get readable production error stacks.,Use sourcemap: 'hidden' in production to avoid exposing source code.,Without source maps, production errors show minified code line numbers.