Photo by Jeremy Thomas on Unsplash
This topic is a tutorial to deploy the angular app on firebase hosting. There is a step by step tutorial on https://firebase.google.com/docs/hosting/quickstart if you are deploying a normal website. But for the Angular App, there is a slightly different approach.
First to build your angular app in production mode
ng build — prod
It builds and minifies the source to dist/you app folder.
Setup Firebase
The first step you have to install the Firebase CLI
npm install -g firebase-tools
The second step you have to login with your firebase account. It will ask you to enter the email, then it will open the browser to sign in the firebase
firebase login
The third step to initiate the firebase project
firebase init
You should see the screen below:
Then it will ask selection as the screen below.
Select the Hosting by press space, then hit enter
What do you want to use as your public directory? dist/you app folder (if you do not have app folder, the just type dist)
Configure as a single-page app (rewrite all urls to /index.html)? Yes
File dist/index.html already exists. Overwrite? No
Sample setup screen:
Deploy Firebase hosting
The final step is to deploy your app on Firebase hosting
firebase deploy
Now you should have website hosting by firebase. Firebase hosting will give you the default URL. You can change to custom URL on your domain name https://firebase.google.com/docs/hosting/custom-domain
We also publish articles on Medium. Take a look and follow us to see when we publish new articles.