Firebase Hosting Multiple Sites

Create multiple sites

Goto Firebase Console -> Hosting, then Advance -> Add another site.

Select a site name, also known as resource name.


Edit firebase.json.

  • Change hosting to array of objects.
  • Each hosting object should have a target field (known as target name).
  • Assign a different public directory for each hosting object
{  "hosting": [    {      "target": "main",      "public": "main/public",      "ignore": [        "firebase.json",        "**/.*",        "**/node_modules/**",        "**/public-*/**"      ],      "trailingSlash": false    },    {      "target": "app",      "public": "app/public",      "ignore": [        "firebase.json",        "**/.*",        "**/node_modules/**",        "**/app/public-*/**"      ],      "rewrites": [        {          "source": "/test",          "function": "test"        },        {          "source": "**",          "function": "nuxtssr"        }      ],      "headers": [        {          "source": "**/_nuxt/*.*",          "headers": [{            "key": "Cache-Control",            "value": "public, max-age=31536000"          }]        }      ],      "trailingSlash": false    }  ],}


firebase serve --only hosting:TARGET_NAME


firebase serve --only functions,hosting:TARGET_NAME


Assign target name to resource name.

firebase target:apply hosting TARGET_NAME RESOURCE_NAME

The command above will update .firebaserc

{  "projects": {    "default": "PROJECT_ID"  },  "targets": {    "PROJECT_ID": {      "hosting": {        "TARGET_NAME": [          "RESOURCE_NAME"        ],        "TARGET_NAME02": [          "RESOURCE_NAME02s"        ]      }    }  }}


firebase deploy --only hosting:TARGET_NAME

NOTE: Cloud functions are shared between multiple sites (actually, functions are independent from hosting). Each hosting site can has its own rewrites via firebase.json.

❤️ Is this article helpful?

Buy me a coffee ☕ or support my work via PayPal to keep this space 🖖 and ad-free.

Do send some 💖 to @d_luaz or share this article.

✨ By Desmond Lua

A dream boy who enjoys making apps, travelling and making youtube videos. Follow me on @d_luaz

👶 Apps I built

Travelopy - discover travel places in Malaysia, Singapore, Taiwan, Japan.