Setup Firebase Hosting

? Which Firebase CLI features do you want to set up for this folder?
# Select `Hosting: Configure and deploy Firebase Hosting sites` (press Spacebar to select, then press Enter).

? Select a default Firebase project for this directory:

? What do you want to use as your public directory? (default is public)
# I press enter because I am using public directory

? Configure as a single-page app (rewrite all urls to /index.html)?
# I pick No. Though VuePress support PWA and function almost like a SPA, but it is also a static html generator capable to handling urls request.

The following files are created

public/404.html
public/index.html

firebase.json
.firebaserc
.gitignore

Deploy

firebase deploy

Access the website: https://PROJECT_NAME.firebaseapp.com

NOTE: I could not access https://PROJECT_NAME.web.app though. The Firebase Console -> Hosting shows coming soon on 22 May 2019.

Testing and Deployment

Rename existing public directory created by firebase.

mv public _public

I created a landing page with VuePress, thus I create a symbolic link to VuePress's dist directory.

ln -s /code/vuepress/PROJECT_NAME/docs/.vuepress/dist/ public

NOTE: public directory should contains all your html, css, js, images, etc.

Test hosting locally.

firebase serve

Access http://localhost:5000.

Deploy

firebase deploy

Setup Custom Domain

Goto Firebase Console - Hosting, click Connect domain.

Domain: either mydomain.com or subdomain.mydomain.com.

Need to add the TXT records below to your DNS provider to verify domain ownership.

NOTE: Some DNS provider like NameSilo takes 15 minutes to published the changes. For a free and faster DNS update, you can use Cloudflare DNS.

After successful verification, add the shown A records to your DNS entry.

NOTE: Make sure to delete existing A records which point to the old servers.

NOTE: If you use mydomain.com, there is a prompt to configure www.mydomain.com to redirect to mydomain.com.

When trying to access https://mydomain.com, it shows a NET::ERR_CERT_COMMON_NAME_INVALID error.

I click on View and change setup mode from Quick setup to Advance and saw the message Wait for your certificate to be provisioned. This may take up to 24 hours..

Also the status changed from Need setup to Pending (it took a 5-10 minutes for the change) - mouse over the question mark for latest status. If the status still remained at Need setup for a long time, you might want to switch from Quick setup to Advance, sometimes there is a request to add _acme-challenge TXT records which are only shown in Advance mode.

References: