出现该报错主要是因为,用户浏览页面期间,懒加载导致的服务器文件名和浏览器缓存文件名不一致,所以获取不到文件。
解决方式:
1.引入webpack-retry-chunk-load-plugin,避免因为网络或其他问题导致的加载失败
2.错误边界ErrorBoundry捕捉并重新加载
//webpack-retry-chunk-load-plugin配置
let {RetryChunkLoadPlugin} = require('webpack-retry-chunk-load-plugin')
new RetryChunkLoadPlugin({
cacheBust: `function() {
return Date.now();
}`,
maxRetries: 2,
})
import React from 'react'
import { observer, inject } from 'mobx-react'
import Component from 'edt-components/Component'
import { sessionStorage } from 'utils/storage'
import FullLoading from 'edt-components/FullLoading'
import _ from 'lodash'
@observer
class ErrorBoundary extends Component {
constructor(props) {
super(props)
this.data = {
hasError: false,
errorType: null
}
this.clearLoadingChunk()
}