zoukankan      html  css  js  c++  java
  • react路由懒加,项目经常上线导致没有刷新的用户出现js文件加载失败: ChunkLoadError: Loading chunk 42 failed.

    解决方案:

    使用错误边界:

    import React, { Component } from 'react'
    
    //错误边界
    //https://zh-hans.reactjs.org/docs/error-boundaries.html#gatsby-focus-wrapper
    export default class ErrorBoundary extends Component {
      constructor(props) {
        super(props);
        this.state = { error: null, errorInfo: null };
      }
      
      componentDidCatch(error, errorInfo) {
        // Catch errors in any components below and re-render with error message
        this.setState({
          error: error,
          errorInfo: errorInfo
        })
        // You can also log error messages to an error reporting service here
      }
      
      render() {
        if (this.state.errorInfo) {
          // Error path
          return (
            <div className="m-error-wrap">
              <div className="m-error-img-wrap">
                <div className="m-error-img"></div>
              </div>
              <div className="m-error-text">网页出错了,请尝试刷新一下~</div>
              <details style={{ whiteSpace: 'pre-wrap' }}>
                {this.state.error && this.state.error.toString()}
                <br />
                {this.state.errorInfo.componentStack}
              </details>
            </div>
          );
        }
        // Normally, just render children
        return this.props.children;
      }  
    }
    

  • 相关阅读:
    真正明白了引用与对象的关系,就能避开下面这个陷阱
    python 垃圾回收
    字典
    表的操作
    MySQL数据库中的存储引擎
    MySQL数据库的基本操作
    MySQL数据库安装文件夹与配置文件简易说明
    数据库概述
    Arrays类
    Math类
  • 原文地址:https://www.cnblogs.com/xutongbao/p/15264322.html
Copyright © 2011-2022 走看看