Webpack 是一个强大的打包工具，能够将多个文件打包成一个或多个最终的文件。然而，将已经经过打包的代码还原回原始源代码并不是一件直接的事情，因为 webpack 打包的过程通常会对代码进行压缩、混淆和优化，丢失了部分变量名和代码结构的信息。因此，完全还原打包前的源码可能并不现实。但是，可以通过一些工具和技术部分还原源码的结构和逻辑。以下是一篇论文的框架，以解释如何尝试还原被 webpack 打包过的代码：
1. 引言
在前端开发中，Webpack 是一个常用的打包工具，能够将多个文件打包成最终可部署的代码。然而，由于 webpack 的优化、压缩和混淆过程，导致打包后的代码难以完全还原为原始源码。本文旨在探讨如何尝试将 webpack 打包后的代码部分还原回原始源码，以及相关工具和技术的应用。
2. Webpack 打包原理
Webpack 的打包过程涉及模块解析、代码转换、依赖图生成和代码打包等多个环节。其中，代码转换阶段会将 ES6+ 语法转换为兼容性更好的代码，并进行压缩和优化处理，从而提高应用的性能和加载速度。
3. 代码还原尝试
尽管完全还原 webpack 打包后的代码是困难的，但通过以下工具和技术可以部分还原源码的结构和逻辑：
- Source Map：Webpack 提供了 Source Map 功能，可以将打包后的代码映射回原始源文件，帮助开发者在浏览器中调试时定位问题，这在一定程度上帮助还原源码结构。
- 代码反混淆工具：一些代码反混淆工具可以帮助还原被混淆过的变量名和函数名，从而提高还原源码的准确性。
- 人工逆向: 由人工分析代码逻辑，逐步解密。
4. 案例分析
考虑以下被 webpack 打包过的简单代码：
// 打包后的代码
!function (e) {
var t = {};
function n(r) {
if (t[r]) return t[r].exports;
var o = t[r] = {i: r, l: !1, exports: {}};
return e[r].call(o.exports, o, o.exports, n), o.l = !0, o.exports
}
n.m = e, n.c = t, n.d = function (e, t, r) {
n.o(e, t) || Object.defineProperty(e, t, {enumerable: !0, get: r})
}, n.r = function (e) {
"undefined" != typeof Symbol && Symbol.toStringTag && Object.defineProperty(e, Symbol.toStringTag, {value: "Module"}), Object.defineProperty(e, "__esModule", {value: !0})
}, n.t = function (e, t) {
if (1 & t && (e = n(e)), 8 & t) return e;
if (4 & t && "object" == typeof e && e && e.__esModule) return e;
var r = Object.create(null);
if (n.r(r), Object.defineProperty(r, "default", {
enumerable: !0,
value: e
}), 2 & t && "string" != typeof e) for (var o in e) n.d(r, o, function (t) {
return e[t]
}.bind(null, o));
return r
}, n.n = function (e) {
var t = e && e.__esModule ? function () {
return e.default
} : function () {
return e
};
return n.d(t, "a", t), t
}, n.o = function (e, t) {
return Object.prototype.hasOwnProperty.call(e, t)
}, n.p = "", n(n.s = 0)
}([function (e, t) {
console.log("Hello, World!")
}]);
通过 Source Map 和代码反混淆工具，可以部分还原打包前的代码结构：
// 还原后的源码
console.log("Hello, World!")
5. 结论
尽管 webpack 打包后的代码很难完全还原为原始源码，但通过利用 Source Map 和代码反混淆工具（下篇我们介绍如何用source map逆向JS代码），可以在一定程度上部分还原代码结构和逻辑。这些工具为开发者提供了一定的便利，帮助他们更好地理解和调试已经打包的代码。
