Firebase deploy 404 can't find index.html - deployment

Question

I'm running firebase init and it's creating firebase.json. firebase.json is in the apps root directory, pointing towards my public directory app. See here:
firebase.json
{
"firebase": "harrison",
"public": "app",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
]
}
Here is where my firebase.json lives:
Here is my public directory, app:
When I run firebase deploy from the command line, everything seems to upload correctly. I then run firebase open or equivalently go to the deploy site, and I get a 404 saying my index.html was not found when it's CLEARLY in the specified directory.

Answer 1

In my case, I simply had to change the path from public to ./public. This might be a version-control bug. I've opened a pull request.

Answer 2

"rewrites": [
{
"source": "**",
"destination": "/index.html"
}
I met the same problem as yours, here is my soluation:
run firebase init
choose the host option
rewrite all to index:yes
overwrite to dist/index :no
and then firebase deploy
and then solve the problem

Answer 3

If you are using Yeoman, run grunt build in your project directory to create /dist directory.
Then, run firebase init (in your project directory again) and type the corresponding Firebase app and just press enter in Public Directory(current directory).
Next, change firebase.json to:
{
"firebase": "<FirebaseAppName>",
"public": "./dist",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
]
}
Finally, run firebase deploy and firebase open.

Answer 4

I faced the same issue. All you need is to write the below code in your firebase.json file
"rewrites": [
{
"source": "**",
"destination": "/index.html"
}
]

Answer 5

I had same problem and was getting 404 then I found that my index.html was present inside my project folder i.e
dist --> project-folder --> index.html
Hence, my firebase.json became
{
"firebase": "<FirebaseAppName>",
"public": "./dist/project-folder",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
]
}

Answer 6

I think I found the reason for this, since i was having the same issues myself.
If your index.html links to faulty external ressources or even internal ressources that takes too long to load, you will end up with an error. Sometimes you get a 503 error and sometimes you get a 404.
Try reducing your html file untill you figure out what is causing it to fault
Also, link to minified versions of all scripts and css files.

Answer 7

I had the same issue, the below solution work for me
Add the below lines in the firebase.json file (which you will find in
your root folder)
"rewrites": [
{
"source": "**",
"destination": "/index.html"
}
]
Redeploy your application with firebase deploy command

Answer 8

Your firebase.json file should look like this:
{
"hosting": {
"site": "biscayne",
"public": "build",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
]
}
}
Make sure you answer build to
What do you want to use as your public directory?
after running firebase init.

Answer 9

Check your node version
node --version
Node versions greater than 10 are not supported. Downgrade to anything lower than 10, if that doesn't work try the following.
firebase login
firebase use --add (Choose the right Project ID)
firebase init (select hosting, than correct Project ID)
if needed (npm run build)
firebase deploy
Solution was number 2 Choosing the right Project ID Because somehow firebase commands was referring automatically to a wrong Project ID
Good Luck

Answer 10

I had the same issue and I solve it by answering y on the
? Configure as a single-page app (rewrite all urls to /index.html)?
question.
After that I npm run build, then firebase deploy.
It worked like a charm.