Firebase Deploy complete but website not shown

Question

it's my first time using Firebase. I deployed my angular project with the Firebase CLI, but when i navigate to the specified domain, i only see

Welcome
Firebase Hosting Setup Complete
You're seeing this because you've successfully setup Firebase Hosting.
Now it's time to go build something extraordinary!

Here's my process to deploy:

firebase login
  ✔  Success! Logged in as [...]
firebase init
  select Hosting, select project, chose 'dist' as public dir
  ✔  Firebase initialization complete!
ng build --prod
firebase deploy
  ✔  Deploy complete!

This is now over 60 minutes ago, and i can't figure out why it's not online. Is 60 minutes not enough time for firebase? Can anyone share his experience or give me a hint what could be the reason why it's not online?

Thank you in advance

Check your `dist` folder. After your build, is there an `index.html` in the dist root or is it in another subfolder like `dist/your-project-name/index.html`? — Tim Martens, Aug 14 '18 at 13:49
there are two things in the `dist`-directory: `index.html` and `my-project-name`-folder. The `my-project-name`-folder also has an `index.html` inside, so i tried specifying `dist/my-project-name/` as public directory, but still the same problem — SHRX, Aug 15 '18 at 05:58
i don't exactly know what i did wrong the first time, but after trying it again it works. when i find out what the problem was on my first try, i'll post it. thank you Mr Martens — SHRX, Aug 15 '18 at 06:40

Harish Kulkarni · Answer 1 · 2019-12-08T21:08:15.097

3

I solved this by following below steps:

Do firebase init step properly by giving correct inputs.

During firebase init when it asked What do you want to use as your public directory?public

As I have given public as a answer

Make sure you give proper link.
run firebase deploy again. It should work.

Happy coding!!

edited Dec 08 '19 at 21:08

answered Dec 08 '19 at 21:02

Harish Kulkarni

1,481
11
18

score 2 · Answer 2 · edited Oct 22 '20 at 09:09

Just a bit more of detail. As you are using Angular, after you build your App to production, it creates (normally) a /dist/ProjectName folder where it puts your files. NOTE: if you want to change this, please refer to the option --outputPath on https://angular.io/cli/build

Sometimes (as newbies) we miss the right folder when asked on the firebase.init command...

No worries, it writes those settings at firebase.json, just open it and look for:

  "hosting": {
    "public": "dist/ProjectName",

Now change it to the desired path and there you go ;) Now you can repeat the firebase.deploy and it should all work.

Hope it helps

No it doesn't help because people don't use visual studio code, they use android studio like it was intended. There are no ng commands and there is certainly no dist

score 0 · Answer 3 · answered Apr 18 '20 at 08:55

After running firebase init you can rebuild your app by running ng build then run firebase deploy to deploy your app to firebse, it again shows welcome screen but wait for 10 to 20 minutes because server is setting up the app and take some time to up and running the app then open app.

score 0 · Answer 4 · answered Jun 26 '20 at 12:39

I had the same problem. I realized that I had the two index.html positions within the dist folder, as @Tim Martens suggested in the question commentary.

Then, in the firebase.json file, I changed:

"public": "dist/name-of-my-project",

...and it worked!!

score 0 · Answer 5 · answered Nov 27 '20 at 17:53

0

instead of

 firebase deploy

use

 firebase deploy --only hosting

answered Nov 27 '20 at 17:53

Salah

513
7
18

score 0 · Answer 6 · answered Jul 10 '21 at 06:18

0

If deploy is completed but page not found then

go into dist folder like :"cd dist" and firebase deploy

It worked for me

answered Jul 10 '21 at 06:18

Imran Shaik

21
4

score 0 · Answer 7 · answered Feb 15 '22 at 02:34

{

"hosting": {
"public": "dist",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"]

}

your firebase json can be like above. Then change it like below.

{
“hosting”: {
“public”: “dist/your_app_name”,
“ignore”: [
“firebase.json”,
“**/.*”,
“**/node_modules/**”
],}

and then try firebase deploy

score 0 · Answer 8 · answered Jun 25 '23 at 06:01

0

I had a similar problem with my web page in Visual Studio, what was giving me this error was that I didn't have a file called 'index.html', after renaming my file to index.html, I ran Deploy again and it worked.

answered Jun 25 '23 at 06:01

Marco

1
1

score 0 · Answer 9 · answered Jul 31 '23 at 07:38

0

Solution for flutter web dev

In the firebase.json file, provide web build path: "public": "build/web".

hosting: {
  "public": "build/web",
  "ignore": [
    "firebase.json",
    "**/.*",
    "**/node_modules/**"
  ]
}

answered Jul 31 '23 at 07:38

Abdullah Khan

1,365
15
15

score 0 · Answer 10 · answered Aug 26 '23 at 19:50

0

In my case, I need deploy at least one time the live channel (production) to "activate" the other preview channels. I think that is because need the Firebase config

answered Aug 26 '23 at 19:50

Matias de Andrea

194
2
11

Please do not post identical answers to multiple questions. https://stackoverflow.com/a/76984612/7733418 – Yunnosch Aug 26 '23 at 19:54
Please don't add the same answer to multiple questions. Answer the best one and flag the rest as duplicates. See [Is it acceptable to add a duplicate answer to several questions?](//meta.stackexchange.com/q/104227) – Yunnosch Aug 26 '23 at 19:55

Firebase Deploy complete but website not shown

10 Answers10

Linked