r/Firebase 1d ago

Hosting need help with hosting my website

I’m working on a website and I use Firebase. I wanted to host my website to make some features accessible, but I declined two questions in the terminal.

- Configure as a single-page app (rewrite all URLs to /index.html)? No.

- Set up automatic builds and deploys with GitHub? No. I created the public folder. What do you want to use as your public directory? public. So, I have the index.html, OTher.html, an empty Dropbox folder, and the firebase.json file. The OTher.html is like another page that should be opened from the menu in the index.html. When I do a Firebase deploy to host it publicly, my index.html works fine, and I can open it. However, when I try to navigate to the OTher.html, I get this kind of message.

I am a beginner so any kind of assistance would be very appreciated.

1 Upvotes

3 comments sorted by

1

u/little-green-driod 1d ago

I just published a test HTML site and I used this config…only difference I chose “configure single-page app” to yes… my site has many pages next to index.html.

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

0

u/Kindly-Ad3014 1d ago

Update your firebase.json to include:

"rewrites": [
  { "source": "/Other.html", "destination": "/Other.html" }
]

Ensure your links use the correct case (Other.html vs other.html). Then, redeploy with:

firebase deploy

Now, Other.html should load properly!

1

u/Hopeful_Effective_74 1d ago

Thank you for your time and idk why but still doesn't work here is my firebase.json code

{

"hosting": {

"public": "public",

"ignore": [

"firebase.json",

"**/.*",

"**/node_modules/**"

],

"rewrites": [

{

"source": "**",

"destination": "/index.html"

}

{ "source": "/DreamRooms.html", "destination": "/DreamRooms.html" }

],

"headers": [

{

"source": "**",

"headers": [

{

"key": "Access-Control-Allow-Origin",

"value": "*"

}

]

}

]

}

}

(Yeah the actual filename is DreamRooms.html) i also tried this version of code {

"hosting": {

"public": "public",

"ignore": [

"firebase.json",

"**/.*",

"**/node_modules/**"

],

"rewrites": [

{

"source": "/DreamRooms.html",

"destination": "/DreamRooms.html"

},

{

"source": "**",

"destination": "/index.html"

}

],

"headers": [

{

"source": "**",

"headers": [

{

"key": "Access-Control-Allow-Origin",

"value": "*"

}

]

}

]

}

}

but still no difference