reverse-sourcemap 反编译 webpack 打包的 .map 类型文件

上次更新 2025年8月20日星期三 3:11:16 字数 0 字 时长 0 分钟

简介

reverse-sourcemap 是一个用于反编译 webpack 打包生成的 source map 文件的工具。通过 source map 文件，我们可以还原出原始的源代码结构。

安装

npm install -g reverse-sourcemap

基本用法

1. 反编译单个 .map 文件

reverse-sourcemap --output-dir ./output ./path/to/your/file.js.map

2. 批量处理多个文件

reverse-sourcemap --output-dir ./output ./*.js.map

参数说明

• --output-dir 或 -o: 指定输出目录
• --verbose 或 -v: 显示详细信息
• --help 或 -h: 显示帮助信息

使用示例

假设你有一个名为 bundle.js.map 的文件：

# 将反编译的文件输出到 ./src 目录
reverse-sourcemap -o ./src ./bundle.js.map

# 显示详细处理信息
reverse-sourcemap -v -o ./recovered ./app.js.map

输出结果

工具会在指定的输出目录中重建原始的文件结构，包括：

• 原始的 JavaScript 文件
• 保持原有的目录结构
• 恢复文件的相对路径关系

注意事项

1. 确保 .map 文件完整且未被压缩
2. 某些经过混淆的代码可能无法完全恢复
3. 输出的代码结构取决于原始构建配置
4. 建议在安全的环境中处理未知来源的 map 文件

常见问题

Q: 为什么有些文件无法恢复？ A: 可能是因为 source map 文件不完整或者原始代码经过了特殊处理。

Q: 输出的代码能直接运行吗？ A: 恢复的代码通常需要安装相应的依赖包才能正常运行。

相关工具

• source-map-explorer: 分析 source map 文件
• webpack-bundle-analyzer: 分析 webpack 打包结果