在 JavaScript 开发中，代码打包和混淆是保护代码知识产权、减小文件体积的重要手段。

混淆工具（如 Terser、UglifyJS、javascript-obfuscator）则通过重命名变量、添加干扰代码等方式增加逆向工程的难度。

实现说明

1. 工作流程：

   1. 使用 Webpack 将多个模块打包为单个文件
   2. 通过 Terser 进行代码压缩和基础混淆
   3. 使用 javascript-obfuscator 进行深度混淆处理
   4. 最终生成难以逆向工程的 dist/bundle.js

2. 混淆主要手段：

   • 变量名替换（如将有意义的变量名改为无意义的短名称或十六进制值）
   • 控制流扁平化（打乱代码执行顺序）
   • 注入死代码（增加代码复杂度）
   • 字符串编码（将字符串转为 Base64 等编码形式）
   • 移除调试信息（删除 console、debugger 等）

3. 使用javascript-obfuscator混淆的注意事项：

   • 混淆会增加代码体积（通常增加 50%-100%）
   • 调试混淆后的代码非常困难，建议只在生产环境启用
   • 某些高级混淆选项可能影响代码性能，需根据实际情况调整
   • 对于需要动态访问的属性（如 obj[var]），可能需要配置 reservedNames 保留特定名称

4. 混淆关键配置解析：

   • controlFlowFlattening: true, // 控制流扁平化是源代码的结构转换，阻碍了程序的理解。此选项极大地影响了性能，运行时速度降低了1.5倍

   • controlFlowFlatteningThreshold: 1, // 设置受控制流展平影响的节点百分比（Default: 0.75 Min: 0 Max: 1）

   • deadCodeInjection: true, // 注入无效代码，增加分析难度

   • deadCodeInjectionThreshold: 1, // 设置增加混淆代码的百分比（Default: 0.4 Min: 0 Max: 1）

   • stringArrayEncoding: ['rc4'], //字符串编码方式。rc4比base64慢约30-50%，但更难获得初始值。

   • selfDefending: true, // 自我保护（防止格式化和解析）

   • identifierNamesGenerator: 'hexadecimal', // 变量名生成方式：十六进制

5. 详细配置见：https://github.com/javascript-obfuscator/javascript-obfuscator