为什么内联源地图？

Question

今天我了解到可以将源映射直接包含在缩小的JavaScript文件中,而不是将它们放在单独的example.min.map文件中.我想知道:为什么有人想做那样的事情？

拥有源映射的好处对我来说很清楚:例如,可以在运行缩小的文件时使用原始的非压缩源文件调试错误.最小化的好处也很明显:源文件的大小大大减少,使浏览器下载速度更快.

那么为什么在地球上我会想要将源地图包含在缩小的文件中,因为地图的大小甚至比缩小的代码本身还要大？

Answer 1

我四处搜索,这是我能看到人们内联源地图用于开发的唯一原因.内联源映射不应在生产中使用.

使用缩小文件内联源映射的理由是浏览器在开发和生产中解析完全相同的JavaScript.像Closure Compiler这样的一些缩小器不仅仅是"缩小"代码.使用高级选项,它还可以执行以下操作:删除代码,函数内联或主动变量重命名.这使得缩小的代码(可能)在功能上与源文件不同.

当然,这仍然可以通过引用外部源映射文件来完成,但是有些人似乎更喜欢内联他们的构建过程.

Answer 2

如果您在Android设备上远程调试Chrome,Chrome调试器不仅可以访问设备上所需的任何文件,还包括单独的地图文件.如果您将它们包含在内,则不会出现此问题.

Answer 3

即使在开发模式下,JS捆绑工具也Browserify可以Webpack将所有.js文件捆绑在一起或多个捆绑包中.因此,在这种情况下,将内联源映射添加到生成的bundle是帮助调试而不带来额外文件的最简单方法.