Firebase redirect all URLs to index.html

Question

I am trying to redirect all URLs to index.html for my SPA. My firebase.json below works when the URL is one directory deep e.g. http://localhost:8000/page1 but not any deeper, e.g. http://localhost:8000/covid19-dashboard/page1/page1a fails to load and gives a console error of Uncaught SyntaxError: Unexpected token '<'. I have also tried the below but with "source": "**/**" and found the same results.

{
  "firestore": {
    "rules": "firestore.rules",
    "indexes": "firestore.indexes.json"
  },
  "hosting": {
    "public": "dist",
    "target": "project-name",
    "ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  },
  "storage": {
    "rules": "storage.rules"
  }
}

Answer 1

This is just a guess, but check your <script> tags to see if they are relative URLs (e.g. <script src="js/main.js">. You need to make them absolute (e.g. <script src="/js/main.js">) so that they will load properly when the relative path changes for deeper links.

The error you're seeing is most likely the result of a script-loaded .js file not existing and therefore loading your index.html instead.