时间戳

首页 > 解决方案 > 使用 React.lazy() 时开发构建崩溃

reactjs - 使用 React.lazy() 时开发构建崩溃

问题描述

我正在使用 react Lazy 和 Suspense 来加载组件，但是如果我尝试使用npm run build构建应用程序，我会收到一条错误消息：错误：未捕获的错误：缩小的反应错误 #294；，并且如果我评论延迟加载构建会成功。代码：

import { Suspense, lazy } from 'react';
const Component= lazy(() => import('./../location'));

const Homepage=()=>{
  return (
    <>
      <Suspense fallback={<div>Loading...</div>}>                
        <Component/>
      </Suspense>
    </>
  )
}
export default Homepage;

标签： reactjsreact-routerreact-hooks

解决方案

当我们使用 ssr（服务器端渲染）或 ReactDOMServer 时，这个错误基本上在路径中命中，

由于 ReactDOMServer 尚不支持 React.lazy 和 Suspense，您需要使用动态导入并删除 Suspense 和 React.lazy 以避免此错误。

推荐阅读