firebase provided hosting-url which is not displaying my angular project's index page

Question

For doing firebase hosting:-

1. created dist folder inside angular project by using "ng build --prod".

2. firebase login

3.

• Created project in console.firebase.google.com
• firebase init
• Choose firebase CLI features as hosting.
• same project name which i created earlier select here same.
• Enter public directory as dist.
• Say yes for spa.
• say no for overriding index.html

And then

4. firebase deploy

   it provides me url:- https://projectname.firebaseapp.com/

5. firebase open

But when i opened the hosting url then "welcome page confirming --Firebase Hosting Setup Complete" is displaying.

"image of Page displaying"

Please suggest where I am doing wrong? and how will my project's index page will start displaying.

Note :- I am not using firebase database so, i select only hosting while initializing.

Answer 1

When you ran firebase init it asked you in which subfolder your public HTML content was stored. The default value for this is public. If you didn't explicitly type a different value, that's where your index.html will need to be.

Alternatively, open firebase.json in a text editor and change the value of the public property to point to the folder you're using. So something like:

{
  "hosting": {
    "public": "dist"
  }
}

Also see the documentation on Firebase Hosting configuration.

Answer 2

Maybe you should change public property and add your App name.

 {
  "hosting": {
    "public": "dist/your_application_name",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}