英文:
Next.js 13 + Firebase Hosting "not found" browser response
问题
我正在尝试跟随在线的所有可用资源来将Next.js 13应用程序部署到Firebase Hosting,但是找不到解决方案;网络上有大量过时/冲突的信息。有一个Vercel示例1对我不起作用,而且似乎是使用pages
结构,而不是我正在使用的SSR默认app
结构。Firebase有一个(简短的)官方文档2,但似乎也使用pages
目录,因为它们引用了getServerSideProps
,这看起来是pages
结构的用法。也许我在这一点上错了,我应该直接在我的应用程序中使用getServerSideProps
?显然,Firebase支持Next.js 13,因为最近的GitHub工具版本3中多次提到了Next.js 13。
我最初根据这个指南构建了一个应用程序,稍微有一些自己的结构样式变化,该应用程序在本地运行得很好,但是当我将这个应用程序部署到Firebase Hosting时,网站只是简单地返回“未找到”:
然后,我缩小规模,从npx create-next-app
构建了一个较小的应用程序,并尝试将其部署到托管服务。部署到托管服务后,我得到了不同的错误界面(糟糕):
现在我的头有点晕,不知道接下来该做什么。在网上搜索得到大量使用pages
结构的人,所以现在我担心,也许Firebase不是我从CRA迁移到Next.js时的最佳解决方案....我已经使用Firebase多年了,所以不想失去所有这些功能!!
其他人在使用Next.js 13在Firebase上启动应用程序时是否遇到过这些问题?我应该使用Vercel而不是Firebase来使用Next.js 13吗?在这方面有任何帮助将会很好!
1: https://github.com/vercel/next.js/tree/canary/examples/with-firebase-hosting
2: https://firebase.google.com/docs/hosting/frameworks/nextjs
3: https://github.com/firebase/firebase-tools/releases
4: https://www.freecodecamp.org/news/create-full-stack-app-with-nextjs13-and-firebase/
5: https://i.stack.imgur.com/Ms3oN.png
6: https://i.stack.imgur.com/tS6kl.png
英文:
I am trying to follow all the available resources online to deploy a Next.js 13 app to Firebase Hosting, but am not able to find a solution; tons of outdated/conflicting info out there. There's this Vercel example that doesn't work for me, but also seems to be using the pages
structure instead of the SSR default app
structure I am using. Firebase has a (brief) official doc here, but it also seems to be using the pages
directory since they reference getServerSideProps
which it looks like is a pages
structuring usage. Maybe I am wrong on this point, and I should be using getServerSideProps
directly in my app? Clearly Firebase has support for Next.js 13, since the recent Github releases for tools makes many references to Next.js 13.
I initial built an app following this guide with some slight variations for my own structure styling, and the app works great locally, but when I deploy this app to Firebase hosting (only), the site is simply giving a "Not found" as a response:
I then scaled back and built a smaller app from npx create-next-app
, and tried deploying that with hosting. After deploying to hosting, I am getting the different error screen (ugh) :
Now my head is spinning a bit and don't know what to go for next. Searching the web comes up with a ton of people using the pages
structure, so now I am worried that maybe Firebase isn't the best solution for me now that I am moving to Next.js from CRA.... I have been using Firebase for years so don't want to lose all those features!!
Has anyone else had these issues while booting up an app with Next.js 13 on Firebase? Should I be using Vercel instead of Firebase for Next.js 13? Any help here would be great!
答案1
得分: 1
firebase-tools的最新版本(12.2.0–12.2.1)存在部署错误。如果您使用该版本,请降级(npm i -g firebase-tools@12.1.0
)或使用此部署命令(FIREBASE_FRAMEWORKS_BUILD_TARGET=production firebase deploy
)。https://github.com/firebase/firebase-tools/issues/5896
这样我就可以在应用程序路由器上运行SSG+SSR了!Reddit上的Firebaser评论说应用程序路由器应该得到全面支持。https://www.reddit.com/r/Firebase/comments/13fbxvh/comment/jkefwpp/
使用页面路由器,我可以实现SSG,但某种原因导致SSR出现内部服务器错误。
部署一个小型测试应用程序需要超过5分钟。我在Vercel的经验要快得多,应该也可以在那里使用Firebase SDK。
英文:
The latest version of firebase-tools (12.2.0–12.2.1) contain a deployment bug. If you use that version, downgrade (npm i -g firebase-tools@12.1.0
) or use this deploy command (FIREBASE_FRAMEWORKS_BUILD_TARGET=production firebase deploy
). https://github.com/firebase/firebase-tools/issues/5896
This way I got SSG+SSR working with the app router!
Firebaser on Reddit commented that app router should be fully supported. https://www.reddit.com/r/Firebase/comments/13fbxvh/comment/jkefwpp/
With the pages router, I got SSG working but SSR gives me Internal Server Errors for some reason.
Deploying a tiny test app already takes >5 minutes. My experience with Vercel is much faster, it should be possible to use Firebase SDK there aswell.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论