Next.js 在生产环境中出现故障,但在开发环境中正常运行。
Next.js 在生产环境中出现故障,但在开发环境中正常运行。
我尝试使用next start
运行Next.js项目(next build
没问题,使用next dev
也可以),在浏览器控制台中看到一些错误消息:
TypeError: e is undefined Error: 迷你化的React错误 #130; 请访问https://reactjs.org/docs/error-decoder.html?invariant=130&args[]=undefined&args[]=获取完整消息,或者在非迷你化的开发环境中使用完整错误和其他有用的警告。 Error: 迷你化的React错误 #130; 请访问https://reactjs.org/docs/error-decoder.html?invariant=130&args[]=undefined&args[]=获取完整消息,或者在非迷你化的开发环境中使用完整错误和其他有用的警告。 页面渲染错误:TypeError: t is undefined
我已经查看了错误消息中的链接,它说:
元素类型无效:期望一个字符串(用于内置组件)或一个类/函数(用于组合组件),但得到:[缺少参数] [缺少参数]
但我还是不明白问题出在哪里。有没有办法在next build
中禁用代码迷你化,并查看完整的回溯?
在生产环境中出现问题而在开发环境中正常工作的原因是,据我所知,Next.js只会在生产构建时检查类型。
我认为在将字符串或无效值传递给react-dom/server
的renderToString
时,我之前见过这个错误。
最有可能发生的原因是,Next.js默认会导入所有的导出并为您渲染页面,所以在这种情况下,我认为您不能随意导出命名的或默认的导出,我认为它必须是页面组件本身的默认导出,而所有的getStaticProps
和其他导出应该是命名导出。
要解决您的问题,只需将export Example
更改为export default Example
。
正如我所见,Next.js会在next build
期间检查类型,我的项目成功完成了。我没有使用getStaticProps
和其他Next.js组件的函数。所有的页面和组件导出都是通过export default
进行的。但是我发现在某些组件中,我有命名导出的TypeScript接口,这会导致错误吗?
我真的不确定,因为它取决于Next.js如何获取您的导出并将其馈送到React的渲染函数中。我建议你除了主要的默认导出之外,将页面中的所有内容都删除,如果它能正常工作,那么你就知道是TypeScript接口导致了问题。或者,你可以继续添加你所拥有的东西,直到它再次出错,然后你就可以确定是什么导致了问题。你能展示一下你从那个页面导出了什么吗?
我在项目的每个页面上都遇到了这个错误,所以我在Layout中发现了这个错误。在index.tsx中尝试导入一些内容后,我发现问题出现在与装饰器交互的一个库中。我删除了那个库和使用它的代码,问题解决了。谢谢!