【问题标题】：Firebase hosting not showing up app?Firebase 托管未显示应用程序？
【发布时间】：2017-10-31 15:03:56
【问题描述】：

我是 firebase 新手，我尝试将我的应用部署到 firebase。我已遵循所有步骤。但是，由于某种原因没有显示我的应用程序。我得到了欢迎模式而不是我的网络应用程序。以下是图片：

【问题讨论】：

您的主要 Web 应用页面在哪个文件中？索引.html？
是的。它在公共目录中
我很确定 index.html 通常在公用文件夹中...当您使用 firebase CLI 进行初始化时是否出现了视图文件夹？你能检查一下公用文件夹中的 index.html 吗？
是的，我有公共文件夹，里面有所有东西。
对于您的网址，您可以在末尾附加“/index.html”再试一次吗？

标签： firebase firebase-hosting

【解决方案1】：

这是因为当您在初始化 firebase 时选择"Y" 时index.html 已自行修改。它基本上已将您自己的索引文件替换为该索引文件。检查并替换索引文件，下次不要覆盖 index.html 文件。它会起作用的。

【讨论】：

解决了我的问题
其实，如果你像以前一样覆盖索引文件。首先，在 firebase init 之后构建项目

【解决方案2】：

Firebase 托管未显示应用？

这个问题可能有两个原因

第一步：

确保包含 index.html 的公用文件夹（在 firebase.json 中定义）“dist”没有被 firebase init 命令修改，如果是，请将其替换为原始项目 index.html

供参考（dist 是标准的，但您可能会有所不同）

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

第二步：

确保在项目的 index.html 中配置你的基本 href

作为

< base href="https://["YOUR FIREBASE PROJECT NAME"].firebaseapp.com/">

和其他捆绑文件一样

< script type="text/javascript" src="https://["YOUR FIREBASE PROJECT NAME"].firebaseapp.com/runtime.a66f828dca56eeb90e02.js"></script>

< script type="text/javascript" src="https://["YOUR FIREBASE PROJECT NAME"].firebaseapp.com/polyfills.14fc14f3e029a8cfd046.js"></script>

< script type="text/javascript" src="https://["YOUR FIREBASE PROJECT NAME"].firebaseapp.com/main.2eb2046276073df361f7.js"></script>

第三步运行命令firebase deploy

享受吧！ ;)

【讨论】：

【解决方案3】：

在这里我找到了问题的答案

Step1：

先初始化firebase。

$firebase init

第 2 步：

立即创建生产版本。

$ng build --prod

步骤：3

是时候部署您的应用了。

$firebase deploy

【讨论】：

【解决方案4】：

在命令 firebase init 之后，转到 public 或 dist 文件夹并选择除 firebase 相关文件之外的所有文件（不是文件夹）并复制到 dist 或 public 文件夹。在此之后执行命令 firebase deploy 并等待一段时间。完成后转到提到的 url 那里你会找到你的工作应用程序。

【讨论】：

【解决方案5】：

我遇到了同样的问题。就我而言，问题不在于firebase。只需清除缓存即可。

【讨论】：

【解决方案6】：

当您运行 firebase init 时，Firebase 会在您的项目文件夹中创建一个文件结构，并根据您所做的选择为您的公共文件创建一个 /public 文件夹（或您指定的其他名称）。在该 /public 文件夹中，它还会创建一个 index.html 文件，其中包含您看到的欢迎消息。您需要获取您的应用程序文件（网页等）并将它们移动到该公共文件夹中并与它们一起替换该 index.html 文件。完成此操作后，运行命令“firebase deploy”，它会更新，您应该会看到您的应用。

【讨论】：

【解决方案7】：

如果您看到此屏幕截图中的内容，则说明 Firebase 生成了另一个 index.html 文件，它指向这个文件而不是您自己的文件。以下是修复方法：

删除 Firebase 生成的 index.html 并保留您自己的。
使用firebase deploy重新部署

【讨论】：

【解决方案8】：

对我自己来说，问题是我给了我的应用程序位置的绝对路径，firebase init 似乎只采用相对路径。

【讨论】：

【解决方案9】：

部署步骤如下

第 1 步：

ng build --prod

第 2 步：

firebase init

    *Are you ready to proceed?* Yes

    *What do you want to use as your public directory?* dist/{your-application-name}

    *Configure as a single-page app (rewrite all urls to /index.html)?(y/N)* Yes

    *File dist/{your-application-name}/index.html already exists. Overwrite?(y/N)* No

第 3 步：

firebase deploy --only hosting

如果您仍然获得相同的页面，只需按“CTRL + F5”，它将清除缓存。

【讨论】：

firebase deploy --only 托管这对我有用，但它意味着什么只托管？
它只会部署新的主机配置，而不是其他配置。如果我们删除--only hosting，firebase 将部署所有配置（功能、托管..）。
它对我不起作用。我什至在 firebase 上创建了一个新项目，只是为了确保没有保留以前部署的设置。

【解决方案10】：

由于 Angular v6 CLI 项目让多个应用程序共享代码库变得更加容易。因此 dist 中的新文件夹。

引用 dotGitignore 答案：

我发现 ng build --prod 会创建一个 dist 和另一个项目位置所在的子文件夹。

在此处查看如何修复它https://stackoverflow.com/a/50360478/11652243

【讨论】：

【解决方案11】：

我遇到了这个问题，并且

如果有人在使用 firebase init 命令后遇到同样的情况，

检查您的公共文件夹中的 index.html 文件（用于反应）。

它可能已被 firebase 覆盖。

为了告诉 firebase 不要覆盖您现有的 index.html 文件，

当 firebase 询问您是否要覆盖现有的 index.html 文件时输入“N”

【讨论】：

【解决方案12】：

唯一的解决方案是 firebase 部署文件是 index.tml 但我们需要构建文件所以替换你的

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

只需用这个替换你的 firebase.json 文件，你就会发现它的魔力

【讨论】：

【解决方案13】：

对我有用的修复是使用 firebase 提供的第二个链接而不是第一个链接：

使用：your-project-id.firebaseapp.com（而不是：your-project-id.web.app）

【讨论】：

【解决方案14】：

在某些情况下，实际上什么都不需要。将所有静态文件移动到您选择的公用文件夹中。使用命令

firebase deploy

然后按 ctrl+f5 清除缓存。那是为我做的。

【讨论】：

【解决方案15】：

如果有人因为而出现在这里

似乎某些以 web.app 结尾的域被 ISP 提供商屏蔽了，对于某些国家/地区，我使用私人 VPN 并访问我的网站，直到它被修复。

【讨论】：

【解决方案16】：

我在 Firebase 中部署网站时遇到了类似的问题。

Firebase 通常会创建两个默认域，web.app 和 firebaseapp.com。如果一个不起作用，请使用另一个。

这解决了我的问题。试试吧！

确保将文件上传到 Firebase。

否则，使用 firebase deploy --only hosting 将文件从公共目录部署到 firebase。

【讨论】：

【解决方案17】：

按照这些步骤进行常规部署。 https://alligator.io/angular/deploying-angular-app-to-firebase/

您必须检查 dist 文件夹中的 index.html 是否由 Firebase 重新生成。

如果是这样，您只需删除由 Firebase 修改的 html 文件并创建一个新的 index.html 文件，然后使用 index.html 实际上是通过$ ng build --prod 创建的。现在输入$ firebase deploy --only hosting。

因此请留意您的 index.html 文件内容及其位置。如果它的位置不是 dist 文件夹。您应该为 firebase.json 文件中的 public 字段提供相应的位置。

【讨论】：

【解决方案18】：

我有同样的问题。请按照以下步骤操作：

火力基地初始化

*Are you ready to proceed?* Yes

Make a public folder and Copy your all files into it

*What do you want to use as your public directory?*(public) -->only press enter

*Configure as a single-page app (rewrite all urls to /index.html)?(y/N)* N

*File public/index.html already exists. Overwrite?(y/N)* No

这就是您的应用将托管...

【讨论】：

【解决方案19】：

@arslan 的回答在这里帮助了我并为我工作，从一个空白网页到能够看到我的应用程序。

我的解决方案：我编辑了我的 firebase.json 文件，然后 npm run build，然后重新运行了我的命令 firebase emulators:start。将文件从

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

到...

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

【讨论】：

正如目前所写，您的答案尚不清楚。请edit 添加其他详细信息，以帮助其他人了解这如何解决所提出的问题。你可以找到更多关于如何写好答案的信息in the help center。
这并没有提供问题的答案。一旦你有足够的reputation，你就可以comment on any post；相反，provide answers that don't require clarification from the asker。 - From Review

【解决方案20】：

在部署之前确保您的文件位于新创建的目录中，例如 y 或公共文件夹

【讨论】：

【解决方案21】：

自己想通了，是什么解决了我的问题：

运行构建（npm 运行构建）
手动将 firebase.json 和 .firebasesrc 文件添加到根文件夹
确保 firebase.json hosting->public 设置为“build”
运行 firebase 部署

【讨论】：