1

I am trying to deploy the next js application in firebase.

For which I have made firebase.json like,

{
  "hosting": {
      "public": ".next",
      "ignore": [
          "firebase.json",
          "**/.*",
          "**/node_modules/**"
      ],
      "rewrites": [
          {
          "source": "**",
          "destination": "/index.html"
          }
      ]
  }
  }

With assumption I have given .next as value for public but when running the app in firebase url, it says that the index.html file is missing like and hence throws page not found error,

enter image description here

If I give dist then it throws error as there is no dist folder available.

So can you help me to exactly point out what happens when we build next js app using npm run build and where does the index.html file comes under which folder?

This will help me to rightly point out the index.html which will run the app successful in firebase.

Please help me and I am stuck with this for long. Big thanks in advance.

Undefined
  • 851
  • 5
  • 20
  • 48
  • To deploy Nextjs application, you must configure Node server, it wont server as static site like React – Zayn Jul 10 '20 at 05:51
  • @ZainUlHassan, Thanks for your comment in my crucial time and I am stuck for long and could you please provide steps on how exactly I need to achieve it? I am new in next js app development.. – Undefined Jul 10 '20 at 05:53
  • Signup on heroku, netlify or vercel, there you can just push your code and everything will be configured automatically – Zayn Jul 10 '20 at 05:54
  • did you check this link? https://stackoverflow.com/questions/56284434/how-to-deploy-next-js-app-on-firebase-hosting – newdeveloper Jul 10 '20 at 05:55
  • @ZainUlHassan, I already tried deploying in vercel and no issues with it.. But I need to deploy in firebase which is the requirement.. – Undefined Jul 10 '20 at 05:58
  • @newdeveloper, Yes I did it but it doesn't help me.. I have also tried modifying the package.json like that but nothing helps me.. – Undefined Jul 10 '20 at 05:59
  • @Undefined pointing to index.html will not work because with `next.js` there can be many different types of pages (i.e. `statically generated`, `server side rendered`, `with incremental static generation`) that you can serve. Additionally, you have to configure a server that will handle the `request`s. Here is an [example](https://github.com/jthegedus/firebase-gcp-examples/tree/master/functions-nextjs) and [another one from nextjs repo](https://github.com/vercel/next.js/tree/canary/examples/with-firebase-hosting) which demonstrates how to configure the app for firebase hosting. – subashMahapatra Jul 10 '20 at 06:45

0 Answers0