Blank page after successful Firebase deployment

Have a look at the public property of you package.json

"public": "public",

It points to the resource folder where firebase hosting will look for your application. If the resource folder is empty, you will be presented with a blank page

When you build your react app, all the files go to the build folder by default, if you have not specified otherwise. So set the public property to your reactjs build folder.

After you have initialized your Firebase application with firebase init, you should have a firebase.json file in your project's folder. The thing is that the public key has to point to your build folder. For instance, in create-react-app the build folder is build/ after you have ran npm run build for the first time. Then the firebase.json has to look similar to this one:

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

The public key points to build. Then try another deploy with firebase deploy.

Check you don't have the homepage property set inside package.json. I had it because I was also deploying to Github pages at first. Removed it, rebuilt, redeployed and worked.

I was having the same problem. http://localhost:3000/ was serving the app well but when I deployed using npm run build and then firebase deploy I was just seeing a blank page.

I am not sure of the reason why, but I changed the 'public" property in the firebase.json to "build" and it worked.

here is my new firebase.json document.

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