使用 SourceMap 解绑 webpack bundle.js

Posted 2023-03-07

【中文标题】使用 SourceMap 解绑 webpack bundle.js

【英文标题】：Unbundle a webpack bundle.js with the SourceMap

【发布时间】：2018-03-17 09:13:43

【问题描述】：

我想反转或解绑 bundle.js。 目前我正在我的浏览器（Chrome）中加载 bundle.js Chrome 检测到 sourcemap 并向我展示了一个很好的结构 基于捆绑包的完整应用程序。该应用程序已捆绑 使用 webpack 并且是一个通量反应应用程序。

有没有办法从包中生成所有这些文件，这样我就可以 轻松浏览基于应用程序结构的捆绑包？

这是一个逆向工程项目，从 现有的捆绑包。

所以在 chrome 中，我可以使用 devtools 源很好地浏览整个应用程序。 并查看所有单个文件。但我想创造那个确切的 我的本地驱动器上的相同结构。

我正在尝试像debundle 这样的工具，但我找不到将源映射添加到此转换的方法？

如果：

Sourcemap 可用 Chrome 可以轻松地向我显示结构和单个文件 捆绑包未缩小或加扰。 Bundle 是使用 webpack 创建的

【参考方案1】：

我发现shuji 是一个不错的选择 - 您只需提供指向它的源映射的路径即可。它完美地解开了我用 babel 和 webpack 制作的示例包。但它不会保留文件夹结构，所有文件都只是放在一个文件夹中。

【讨论】：

假设我解绑它，进行编辑，现在我想把它打包回来，有办法吗？