javascript - webpack-obfuscator打包之后有个页面打不开是什么问题？

Question

"webpack-obfuscator": "2.6.0"
更新到生产环境发现有一个页面打不开，我排除掉node_modules，但是好像不生效，不知道什么原因。
有问题的页面用到了tinymce和moment

怎么解决？

Answer 1

在使用 webpack-obfuscator 打包后遇到页面无法打开的问题，通常与代码混淆过程中可能引入的错误或兼容性问题有关。由于你提到有问题的页面使用了 tinymce 和 moment，这里有几个可能的解决步骤和检查点：

1. 检查混淆配置：
   确保 webpack-obfuscator 的配置没有错误地影响到 tinymce 或 moment 的代码。特别是检查是否有任何全局变量、特定的库或模块被错误地重命名或删除。
2. 更新和兼容性：
   检查 webpack-obfuscator、tinymce 和 moment 的版本是否兼容。有时候，库的更新会引入不兼容的更改，特别是在与混淆工具一起使用时。
3. 排除混淆：
   尝试暂时禁用 webpack-obfuscator 插件，看看问题是否仍然存在。这可以帮助确定问题是否确实由混淆引起。
4. 查看控制台错误：
   在浏览器中打开开发者工具，查看控制台是否有任何错误消息。这些错误可能会给出关于为什么页面无法加载的线索。
5. 源代码映射：
   如果可能，启用源代码映射（source maps）以在浏览器中调试混淆后的代码。这可以帮助你更准确地定位问题所在。
6. 清理和重建：
   确保完全清理了旧的构建文件（不仅仅是 node_modules），包括 dist 或其他输出目录。有时候，旧的构建文件可能会干扰新的构建。
7. 检查Webpack配置：
   查看Webpack的其他配置部分，如加载器（loaders）和插件，确保它们没有与 webpack-obfuscator 冲突。
8. 社区和文档：
   查看 webpack-obfuscator、tinymce 和 moment 的官方文档和社区论坛，看看是否有其他人遇到并解决了类似的问题。
9. 逐步调试：
   如果问题仍然存在，尝试逐步注释掉或移除页面上的某些部分（如 tinymce 或 moment 的使用），以确定是哪个部分导致了问题。
10. 回退版本：
    如果问题开始于某个特定的库或 webpack-obfuscator 的更新之后，考虑回退到之前的稳定版本。

这里是一个简化的检查列表，你可以根据这些步骤来诊断和解决问题。如果问题依然存在，可能需要更详细的日志或错误消息来进一步分析。