Source Map 原理与 Debug 实战
Source Map 文件的结构和工作原理是什么？如何配置 Webpack/Vite 生成 Source Map？mappings 字段中的 VLQ 编码如何解析？生产环境如何安全使用 Source Map？
回答
我还是少年
Source Map 结构: version/sources/names/mappings/file/sourcesContent。mappings 用 Base64 VLQ 编码，存转换后到原始位置的映射。格式: AAAA,SAAS;... 每分号对应一行，逗号分隔段，每段 1/4/5 个值。Webpack devtool: source-map/cheap-source-map/eval-source-map/hidden-source-map/nosources-source-map。Vite: build.sourcemap:true。安全: 用 hidden-source-map 不自动加载；只上传 Sentry。注意: 不要公开暴露 sourcemap 文件。