Firebase not picking up index file from index folder

Question

I have added 2 folders in public

1- a folder named 'index' contains index.html.

2- a folder named 'about contains index.html.

I've hosted these 2 folders on firebase but firebase isn't picking index.html from index folder, but if I paste directly in root it picks it up, why is this so? I also want to add one thing more that linking to just 'about' folder it automatically picks index.html file from about folder whenever I want to navigate from index to about.

I want to achieve this

instead of this

Answer 1

You should use one or more rewrites and/or redirects, see the documentation here: https://firebase.google.com/docs/hosting/url-redirects-rewrites

For example, the following firebase.json file would work:

{
  "hosting": {
    "public": "public",

    "redirects": [ {
      "source" : "/contact",
      "destination" : "/contact/contact.html",
      "type" : 301
    } ],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index/index.html"
      }
    ],

    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ]
  }
}

Note that instead of "a folder named about contains index.html" we use in the above config a folder named contact which contains a contact.html file.