Deploying Blazor Webassembly app to Firebase Hosting

Blazor Webassembly app and Firebase Hosting pair quite well together, and I have listed below the essential steps to get you going.

Publish your Blazor Webassembly app

• Get your Blazor webassembly app working on local setup.

• Publish the app with Deployment Mode as "Self-Contained" and Target Runtime as "browser-wasm"

• I published to the default suggested path:
  "bin\Release\net8.0\browser-wasm\publish\"

Setup Firebase

Next I start following the below instructions for setting up Firebase Hosting.
https://firebase.google.com/docs/hosting/quickstart

Install Firebase CLI

If not already done for any other project, install the Firebase CLI from below link.
https://firebase.google.com/docs/cli#install_the_firebase_cli

I followed the npm method since I already use node, but you can also go via Firebase binary for Windows.

npm install -g firebase-tools

Login for Firebase CLI

Next you need to login to Firebase to grant permission to the CLI to control your Firebase Projects.

firebase login

Confirm the list of your Firebase Projects

Confirm that the project you wish to use for hosting is present in the list of projects.

firebase projects:list

Initialize the Firebase Project in your Blazor Project folder

Go to the Blazor Webassembly project folder (not the solution) and initialize a firebase project there.

firebase init

Which Firebase features do you want to set up for this directory?
# Select Hosting for the purpose of this article 

Use an existing project
# Select a project from the list which you wish to use for hosting

Next it will ask for the app public directory. Specify the below folder where Visual Studio has copied the published app.
bin/Release/net8.0/browser-wasm/publish/wwwroot

=== Hosting Setup

Your public directory is the folder (relative to your project directory) that
will contain Hosting assets to be uploaded with firebase deploy. If you
have a build process for your assets, use your build's output directory.

? What do you want to use as your public directory? bin/Release/net8.0/browser-wasm/publish/wwwroot
? Configure as a single-page app (rewrite all urls to /index.html)? No
? Set up automatic builds and deploys with GitHub? No
+  Wrote bin/Release/net8.0/browser-wasm/publish/wwwroot/404.html
? File bin/Release/net8.0/browser-wasm/publish/wwwroot/index.html already exists. Overwrite? No
i  Skipping write of bin/Release/net8.0/browser-wasm/publish/wwwroot/index.html

The Firebase Project Initialization is complete. This "firebase init" command above creates a "firebase.json" file which contains the project settings.

Deploy your Blazor Webassembly app to Firebase Hosting

Finally issue below command to deploy your static assets (including index.html) from the wwwroot folder path specified above to the firebase hosting server.

firebase deploy
OR
firebase deploy --only hosting

Your webassembly app is now deployed to the firebase <app_name>.web.app URL.

Connect a custom domain to your deployed app

This is an optional step if you wish to connect your custom domain along with the *.web.app domain provided by default from Firebase Hosting.

Let's follow the instructions at:
https://firebase.google.com/docs/hosting/custom-domain

Visit your Firebase Project in the console at: https://console.firebase.google.com

• Click on the button to add custom domain and provide your domain name.

• You will be asked to add a few records in your DNS settings in your domain name.

• Visit your domain name provider and add the specified records.

You are done, once the domain name custom records are updated, click verify in the Firebase console and you are good to go.

Hope this post helped you setup your hosting.