求助面试题，在测试环境测试无误，在正式环境中会出现空白页面，应该如何排查？

Question

在面试过程中，遇到如下问题

在测试环境测试无误，在正式环境中会出现空白页面，由于是用框架打包的，所以代码是压缩，无法使用断点

客户还是在外地的，此时我应该如何排查问题？

请求资源没有问题，可能是js文件在正式环境中有问题，但是因为代码是压缩的，所以无法看出错误，怎么解决这个问题？

Answer 1

1.首先，废话不多说，一旦出现问题是要先回滚的。如果你能记录下当时的js的url，那么可以为后续提供帮助。

2.接下来说用本地来调试线上的环境，首屏空白，如果排除网络问题，那么可以看出这是个单页应用，因为现在的单页应用都是这样的情况，如果js不加载出来，就是一个白屏。所以我就当你这个问题是一个单页应用的白屏问题。本地调试线上的环境，需要有代理工具，例如charles，比如，线上有一个叫做vender.js的文件，url可能是这样的，xxx.com/dist/vender.js,在本地可能是localhost:8080/dist/vender.js，利用工具，将请求转到线上。如果看到本地也是白屏（默认你开发环境是没问题的），那么问题就是js的问题，就要去看js的版本号是否正确，还要看控制台是否报错。控制台有报错，白屏的话，应该好理解。如果以上都没有，你就再看看是否是html的一些文件的顺序。因为现在的单页应用js的加载顺序是有强依赖关系的。

总结起来如果保证测试环境是没有问题的，排查的方向个人觉得在代码层面的可能性较小，更多可能是流程/网络方面。

Answer 2

不是不能调而是 众所周知的原因
从新打包，带上 Source Map。

Answer 3

确定资源是否正确加载，打开控制台得network看请求是否正确返回资源，测试环境和正式环境一般会存在资源不同源或者编译时静态资源uri配置不一致问题，测试环境和正式如果源代码一致，资源加载没问题，那说明服务端得资源是没问题得，那可能是一，终端环境得问题，二，编译配置导致得问题

Answer 4

在source下有个pause on exceptions的按钮。
选中它。
刷新页面。
每一个断点时，查看数据，根据实时数据分析哪里出问题了。

而且题目中说的是白屏，根据经验，一般都是网络慢，导致文件加载慢引起的。
那么查看方式就是首先看network的访问。这里排查的是：是不是文件太大，引起的加载慢。
其次是性能分析：通过Performance来确定哪里性能慢，再优化。