Next.js 自定义 _error 页面仅在本地工作

Question

这里有一个链接到我的仓库来演示这个问题：https://github.com/jonathanwelton/nextjs-custom-error-test

我正在尝试在 Next.js 中使用自定义 _error 页面，当您访问 /throw（引发错误的页面）时，该页面适用于本地生产构建（npm run build && npm start），但 Netlify 都没有或 Vercel 在部署应用程序时尊重它。我刚刚收到一个堆栈跟踪，你可以在这里看到：https://nextjs-custom-error-test.netlify.app/throw

恢复到 Next.js 9.4.4，自定义 _error 页面可在 Vercel 上运行，但您似乎无法在 Netlify 上部署低于版本 10 的 Next.js 应用。

我刚刚更新了应用程序以使用 Next v11.0.0，但问题仍然存在。

谁能解释我做错了什么？

Answer 1

如文档中所述：https://nextjs.org/docs/advanced-features/custom-error-page

我们需要传递props，判断是显示实际页面还是错误页面。

像这样修改代码

export async function getServerSideProps() {
  try {
     // Your statements
     throw new Error('a new error')

     return {
      props: { data: [] },
     }
  } catch(e) {
     return {
         props: { errorCode: 500 },
     }
  }
}

const Throw = ({ errorCode, ...data }) {
  if (errorCode) {
    return <Error statusCode={errorCode} />
  }

  return <div>{...}</div>
}
export default Throw;