Firebase React Router does not work

Use a rewrite to show the same content for multiple URLs. Rewrites are particularly useful with pattern matching, as you can accept any URL that matches the pattern and let the client-side code decide what to display.

You can also use rewrites to support apps that use HTML5 pushState for navigation. When a browser attempts to open a URL path that matches the specified source or regex URL pattern, the browser will be given the contents of the file at the destination URL instead.

Specify URL rewrites by creating a rewrites attribute that contains an array of objects (called "rewrite rules"). In each rule, specify a URL pattern that, if matched to the request URL path, triggers Hosting to respond as if the service were given the specified destination URL.

Here's the basic structure for a rewrites attribute. This example serves index.html for requests to files or directories that don't exist.

"hosting": {

  // ...

  // Serves index.html for requests to files or directories that do not exist

  "rewrites": [ {

    "source": "**",

    "destination": "/index.html"

  } ]

}

This actually worked amazingly well. Basically any URL that is not found was taking to index.html. But if a url that existed, then it was taking to the actual path

For example, to direct all requests from the page /bigben on your Hosting site to execute the bigben function:

hosting": {

  // ...

  // Directs all requests from the page `/bigben` to execute the `bigben` function

  "rewrites": [ {

    "source": "/bigben",

    "function": "bigben"

  } ]

}

references:

https://stackoverflow.com/questions/52939427/react-router-doesnt-route-traffic-when-hosted-on-firebase/52939519