Firebase CLI: “Configure as a single-page app (rewrite all urls to /index.html)”

Question

I just used the Firebase CLI to init a static hosting project. What exactly happens when you enable the "configure as a single-page app" option? I'm looking for a description of exactly which files are modified, and what kind of effect this has on the Firebase backend.

Answer 1

That option simply sets a flag in the firebase.json file to redirect all URLs to /index.html.

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

See the documentation of Firebase Hosting for more information.

Answer 2

Full example:

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

Answer 3

Official Firebase explanation:

We had used that option last year (Q1 & Q2) but it seemed to do nothing, but nowadays when we apply it, definitely things work very different. The complete official explanation of what it does comes in here:

https://firebase.google.com/docs/hosting/url-redirects-rewrites#section-rewrites

There's even some useful information about Headers usage in the next section of the same page.

Answer 4

As a note: if you would like to have Server-Side Rendering (SSR), type No and set up your rewrites as follow:

"rewrites": [
  {
    "function": "angularUniversalFunction",
    "source": "**"
  }
]

After all, whatever you will choose you can always change this in a firebase.json file.