最近,我在我的 nextjs 应用程序中发现了一些恼人的错误,我很长时间无法修复它们。这些错误仅在我的生产环境中显示,并且无法追踪。结果我找不到这个错误的原因。
1,缩小反应错误#329,我检查了反应文档,它的意思是:未知的根退出状态。 我认为这是一个反应水合错误,但奇怪的是,它偶尔发生。 一旦发生这种情况,某些组件就会停止运行,渲染进度也会停止。单击页面后,页面会继续工作,例如渲染页面内容、发出请求...,此错误在我的应用程序中的许多页面上偶然发生。
基本逻辑是,初始状态是一个空白的ui,然后我在useEffect钩子中从服务器获取数据。当329错误发生时,页面停在空白的ui上,并且useEffect里面的代码没有被执行。当我点击页面上的任意位置后,一切都正常了。
2,一些缩小的 React 错误 #418,这也是一个 React 水合错误。但我只是不知道如何解决它。
对于329错误,
我用服务器组件更改客户端组件(从服务器获取数据)。并尝试使用 ssr false 动态导入内部组件,然后将数据传递给组件。结果,329错误发生的次数比以前少了,但我仍然发现它发生在移动设备上。
我不知道这是否是解决问题的正确方法。但实际上我已经习惯了客户端组件,我认为这对我来说不是一个好方法。
确保您的 getStaticProps、getStatiPaths 等正常工作。