如果NEXTJS应用程序包含[id].js页面，如何在谷歌主机上部署它

Question

我有一个使用谷歌托管的应用程序。在实现动态路由之前，我通过执行next export和firebase deploy来托管它。

在我的[id].js文件中，我使用getServerSideProps获取数据，在执行next export时，我得到了下一个错误：

无法导出带有getServerSideProps的

页面阅读更多。

并且解决方案是"；从包.json中删除next export"；。但是，如果没有next export，我如何托管我的应用程序？

Answer 1

为什么不在vercel上托管您的应用程序？它让一切都变得如此简单。如果你真的想在谷歌上托管它，用getStaticProps或客户端渲染替换getServerSideProps

Answer 2

对于这种情况，我只找到了一个解决方案，那就是使用getStaticProps和getStaticPaths而不是getServerSideProps，下面是官方文档中如何正确使用它的示例：

// pages/posts/[id].js
function Post({ post }) {
// Render post...
}
// This function gets called at build time
export async function getStaticPaths() {
// Call an external API endpoint to get posts
const res = await fetch('https://.../posts')
const posts = await res.json()
// Get the paths we want to pre-render based on posts
const paths = posts.map((post) => ({
params: { id: post.id },
}))
// We'll pre-render only these paths at build time.
// { fallback: false } means other routes should 404.
return { paths, fallback: false }
}
// This also gets called at build time
export async function getStaticProps({ params }) {
// params contains the post `id`.
// If the route is like /posts/1, then params.id is 1
const res = await fetch(`https://.../posts/${params.id}`)
const post = await res.json()
// Pass post data to the page via props
return { props: { post } }
}
export default Post