Why after the deploy of my Angular application on Firebase Hosting service I am obtaining this page?

I am trying to deploy an Angular application on Firebase and I am finding some problem.

First I entered into my project directory and I build my project for production by:

[email protected]:~/Documents/Angular-WS/color_patch$ ng build --prod

After that the project builded correctly I obtained this folder structure into the dist directory of my project:

enter image description here

this /dist/ folder contains the build process output (included the index.html file)

Then I have done:

firebase init

and I selected this voice: Hosting: Configure and deploy Firebase Hosting sites

following it asked me:

  1. What do you want to use as your public directory? (public): I wrote dist because here was created the color_patch directory that should be my package that have to be deployed
  2. Configure as a single-page app (rewrite all urls to /index.html)? I wrote yes
  3. File dist/index.html already exists. Overwrite? (y/N) I wrote yes

It complete without problem

Then I go into my project directory and I deploy my project by this command:

[email protected]:~/Documents/Angular-WS/color_patch$ firebase deploy

It complete without error (it says "Deploy complete!")

If I go into my Firebase console, into the hosting section, I can see my deploy and the correct number of files uploaded.

The problem is that, trying to access to the URL of my deployed application I am now obtaining a page containing this message instead my web application:

enter image description here

Why? What is wrong? What am I missing?

Source: Angular Questions