最近在Sentry监控上老是看到类似 "Loading chunk xxx failed"的错误，看意思是分包加载load chunk 失败了，但是为什么失败就很诡异，一开始跟同事找了半天也没有找到原因，就在前几天，偶然想到了原因，引出了本文...
先说结论吧：用户在实时使用我们的产品，而我们有几次上线并没有选择在深夜凌晨，而我们的产品又使用了懒加载的模式，这样就导致了用户在跳转到其他页面时，其他页面的script没有被加载，页面就报错了。
解决方案：1.首次加载的时候加载全部的script，这样做简单粗暴。
缺点：首次加载速度会变慢，用户首次进入页面需要等待时间会变长。
2.仍然采用懒加载的模式，当监测到"Loading chunk xxx failed"错误时，提示“有新版本请刷新当前页面”，使用angular 的全局 ErrorHandler即可做到，伪代码如下：
export class ChunkErrorHandler implements ErrorHandler {
handleError(err: any): void {
if(isChunkError(err)){
notifyUserUpdatePage();
}
}
}
@NgModule({
providers: [
{ provide: ErrorHandler, useClass: ChunkErrorHandler },
]
})
export class AppModule {}
缺点：当上线用户在使用产品时，会弹窗提示“有新版本请刷新当前页面”，会阻塞用户使用，造成用户体验不佳。
个人更加倾向使用方案2 + 晚上部署，尽可能减少影响用户的使用体验，当出现这种情况时，也能够引导用户如何处理。
思考：当遇到难以复现的报错时,需要从多个角度去思考，有时候报错并不一定是代码层面的问题。一开始遇到这个报错时，只想到了webpack打包有问题，用户设备的兼容性有问题。而事实上都不是。到底还是见过的问题少了呀...
