Firebase Hosting, create a 404 page

Question

I'm using Firebase to host a domain with some static html, javascript and images. It works great. The last thing I want to do, is creating a custom 404-error page. According to the Firebase Hosting Documentation (link) I only have to put a file called '404.html' inside the project public directory. It doesn't work. A tree view of my project directory:

• 404.html
• index.html
• images (directory)
• robots.txt

My firebase.json file looks like this:

{
  "database": {
    "rules": "database.rules.json"
  },
  "hosting": {
    "public": "domain.com",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}

What am I doing wrong? Thanks.

Answer 1

Your source is:

"source": "**"

This causes all routes to go to the index.html file. Since all routes go there, it will never throw a 404. If you want the 404 to work, you must specify the routes that actually work. ie:

"source": "/"