Firebase hosting allows to host web apps, let’s see how can publish the Ionic app to Firebase hosting.
Following are the steps:
- Generate production www web App folder from the Ionic app
- Prepare Firebase Hosting project to publish the web app
- Copy www folder to Firebase hosting project
- Publish the web app
Generate production www web app folder from the Ionic app
Use following command in existing ionic project to generate production web app www folder.
ionic capacitor build browser --prod
This will generate a www folder, which we need to publish to the Firebase hosting.
Prepare Firebase Hosting project to publish the web app
Install Firebase CLI
Install Firebase CLI globally, if not already installed.
npm install -g firebase-tools
Login to Firebase, through Firebase CLI
Login to Firebase through firebase CLI, using following command. This will open a login screen in browser window. Login there.
firebase login
Create Firebase hosting project
Create new directory for firebase hosting project
mkdir hosting
Switch to directory
cd hosting
Initialize Firebase hosting project
Enter following to initialize firebase hosting project.
firebase init
Choose Yes, to initialize the Firebase project

Choose following hosting feature from listed options:
Hosting: Configure files for Firebase Hosting and (optionally) set up GitHub Action deploys

Next selected Use an existing project, because in my case I had an existing project.

Then select your project from the list.
Next question is
What do you want to use as your public directory? (public)

type www

Next Question
Configure as a single-page app (rewrite all urls to /index.html)? (y/N)

Choose Y
Next question
Set up automatic builds and deploys with GitHub? No
Enter, and firebase initialization will complete.
In the hosting folder one www folder will be created.
Copy www folder to Firebase hosting project
In the hosting folder one www folder will be created.
Replace this folder with the www folder generated above from Ionic production web app build .
Publish the web app
Finally, enter following command to publish the web app.
firebase deploy
Web app will be published to firebase hosting and you will be presented with the published web app url.
Congrats! We successfully published web app from ionic project to the Firebase hosting.
Conclusion
In this post we learned how to publish an Ionic web project to Firebase hosting.
First we generated the www folder from the Ionic app. Then We created and prepared a new project for publishing to Firebase hosting. In the Firebase hosting project we copied the www folder from the Ionic app and then finally published to Firebase hosting using firebase deploy