使用SourceMap解开webpack bundle.js

Question

我想反向或解包bundle.js。 目前我正在浏览器中加载bundle.js（Chrome）Chrome检测到源图，并根据捆绑包向我展示了完整应用程序的一个很好的结构。 该应用程序使用webpack进行捆绑，是一种助焊剂反应应用程序。

有没有办法从捆绑包中生成所有这些文件，以便我可以根据应用程序结构轻松浏览捆绑包？

这是一个逆向工程项目，用于从现有捆绑包中获取应用程序源。

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

我试图像一个工具debundle但我不能找到一种方法，将sourcemap添加到这种转换？

因此，如果符合以下条件，我可以轻松地解开现有的bundle.js：

• 源图是可用的
• Chrome可以轻松向我显示结构和单个文件
• 捆绑没有缩小或扰乱。
• Bundle是使用webpack创建的

Answer 1

我发现shuji是一个不错的选择 - 你只需提供源图的路径即可。 它解开了我用babel和webpack完美制作的示例包。 它不保留文件夹结构，所有文件最终都在一个文件夹中。