--- title: 'react路由懶加，項目經常上線導致沒有刷新的用戶出現js文件加載失敗： ChunkLoadError: Loading chunk 42 failed.' date: 2021-08-04 11:06:00 --- 解決方案： 使用錯誤邊界： ```javascript 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; } } ```