Why do I get an error with routing after deploying my Angular 9 + Firebase application

Question

I'm creating Angular 9 Univeral app with Firebase. After the deployment (SSR and non-SSR versions) I started facing the problem:

• when I go to the main route (/) and then to any other route - everything works fine
• when I open the any route (/article for example) and then force reload the page (CTRL + SHIFT + R) I get an 500 error

My firebase.json:

{
  "firestore": {
    "rules": "firestore.rules",
    "indexes": "firestore.indexes.json"
  },
  "hosting": {
    "public": "dist/dailycoding/browser",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "**",
        "function": "ssr"
      }
    ]
  }
}

Here is an error at the console

I don't have this error at my local machine and I don't know why it happens at the server. Any advises?

Answer 1

I had problem with ssr cloud function. It didn't deploy because of error so when I changed my firebase.json to the following one, my routing started working again.

{
  "firestore": {
    "rules": "firestore.rules",
    "indexes": "firestore.indexes.json"
  },
  "hosting": {
    "public": "dist/dailycoding/browser",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}