启用Source Maps可将压缩JS映射回原始源码：一、确保构建工具生成.map文件并正确引用；二、Edge中开启JavaScript/CSS source maps；三、Sources面板查看原始文件并调试；四、路径错误时手动映射本地源码；五、通过断点位置、堆栈函数名和变量名验证生效。
如果您在Edge浏览器中调试经过压缩的JavaScript代码，发现源代码难以阅读和定位问题，则可以启用并使用“源映射”（Source Maps）功能将压缩后的代码映射回原始未压缩的源文件。以下是实现该功能的具体步骤：
一、确认构建工具已生成Source Map文件
Source Maps并非浏览器原生提供，而是由构建工具（如Webpack、Vite、Terser等）在打包时生成的独立.map文件。浏览器需通过脚本标签中的sourceMappingURL注释或HTTP响应头定位并加载该文件。若缺失.map文件或其路径错误，Edge将无法还原源码。
1、检查压缩后的JS文件末尾是否包含形如//# sourceMappingURL=script.min.js.map的注释。
2、在开发者工具的“网络”(Network)面板中刷新页面，筛选JS资源，查看对应.map文件是否返回HTTP状态码200。
立即学习“Java免费学习笔记（深入）”；
3、若使用构建工具，确保配置中开启sourceMap选项：例如Webpack中设置devtool: 'source-map'，Vite中设置build.sourcemap: true。
二、在Edge开发者工具中启用Source Maps支持
Edge默认启用Source Maps解析，但可能因设置被手动关闭或工作区配置异常而失效。需确认当前调试上下文已激活该功能，以确保.map文件被正确加载与关联。
1、按F12打开Edge开发者工具，切换到“设置”（Settings）图标（齿轮形状）。
2、在左侧菜单选择Preferences，向下滚动至Debugger区域。
3、勾选Enable JavaScript source maps和Enable CSS source maps（如涉及CSS压缩）。
4、关闭设置面板，重新加载页面以使更改生效。
三、在“源代码”(Sources)面板中定位并展开原始源文件
Edge成功加载Source Map后，会在“源代码”面板中自动显示原始未压缩的文件结构，而非仅展示.min.js。这些文件通常位于webpack://、app://或localhost/等虚拟协议下，反映构建前的真实路径。
1、在开发者工具中切换到Sources选项卡。
2、在左侧文件树中展开Page节点，查找是否存在非.min.js命名的JS文件（如index.js、utils.ts）。
3、若未显示，点击左上角{} (Pretty print)按钮旁的...菜单，选择Reveal in sidebar，可强制列出所有映射源文件。
4、双击目标原始文件，在中央编辑区打开，即可设置断点、查看变量、单步执行。
四、处理Source Map路径解析失败的情况
当.map文件部署路径与JS中声明的sourceMappingURL不一致时，Edge无法自动获取映射文件。此时需通过覆盖路径或本地映射方式手动修复解析关系，使调试器识别原始位置。
1、在Sources面板中右键点击报错的.min.js文件，选择Map to file system resource…。
2、在弹出窗口中点击Add folder，选择本地存放原始源码及.map文件的根目录。
3、在映射规则中，将远程路径（如https://example.com/js/）匹配为本地路径（如C:\project\src\）。
4、确认后，刷新页面，原始文件应出现在Content scripts或Filesystem节点下。
五、验证Source Map是否生效的快捷方法
最直接的验证方式是观察断点行为与堆栈跟踪信息：若断点停靠位置显示的是原始行号而非压缩后的一行，且调用堆栈中函数名、文件名均为开发期名称，则表明Source Map已正确加载并起作用。
1、在原始JS文件中任意位置设置断点（例如console.log('test');所在行）。
2、触发对应代码执行（如点击按钮、发送请求）。
3、断点命中后，在“调用堆栈”(Call Stack)面板中查看函数名是否为未压缩形态（如handleSubmit而非t）。
4、在“变量”(Variables)面板中展开Scope，确认Local中显示的是原始参数名与值，而非a、b等混淆标识符。
