无法在 firebase 上托管我的 Angular 应用程序

Question

我正在尝试在 firebase 上部署我的应用程序，并按照所有步骤在 firebase 上部署应用程序，并且一切都按预期工作，但是当我在 firebase URL 上浏览我的应用程序时，它在浏览器上显示以下消息。

在部署应用时找不到问题所在。

任何提示我该如何解决这个问题？

以下是我在 firebase 上分解时的日志：

MYMAC-M-34RS:WeatherDemo user$ ng build --prod
Date: 2018-04-27T09:49:07.120Z                                                          
Hash: ab47fb71fe9008d24831
Time: 39656ms
chunk {0} polyfills.b6b2cd0d4c472ac3ac12.bundle.js (polyfills) 59.7 kB [initial] [rendered]
chunk {1} main.a17f9a5eb0ac9ec8e538.bundle.js (main) 523 kB [initial] [rendered]
chunk {2} styles.8680ebdddce4fbcb4153.bundle.css (styles) 229 kB [initial] [rendered]
chunk {3} inline.318b50c57b4eba3d437b.bundle.js (inline) 796 bytes [entry] [rendered]
MYMAC-M-34RS:WeatherDemo user$ firebase login
Already logged in as mygmailId@gmail.com
MYMAC-M-34RS:WeatherDemo user$ firebase init

 ???????????????????????????????? ???????????????? ????????????????????????????????  ???????????????????????????????? ????????????????????????????????     ????????????     ????????????????????????  ????????????????????????????????
 ????????        ????????  ????????     ???????? ????????       ????????     ????????  ????????   ????????  ????????       ????????
 ????????????????????????    ????????  ????????????????????????????????  ????????????????????????   ????????????????????????????????  ????????????????????????????????????  ????????????????????????  ????????????????????????
 ????????        ????????  ????????    ????????  ????????       ????????     ???????? ????????     ????????       ???????? ????????
 ????????       ???????????????? ????????     ???????? ???????????????????????????????? ????????????????????????????????  ????????     ????????  ????????????????????????  ????????????????????????????????

You're about to initialize a Firebase project in this directory:

  /Volumes/DATA/Projects/experiments/Angular-5/Demo/WeatherDemo

Before we get started, keep in mind:

  * You are currently outside your home directory
  * You are initializing in an existing Firebase project directory

? Which Firebase CLI features do you want to setup for this folder? Press Space to select features, then Enter to confirm your choices. Hosting: Configure and deploy Firebase Hosting sites

=== Project Setup

First, let's associate this project directory with a Firebase project.
You can create multiple project aliases by running firebase use --add, 
but for now we'll just set up a default project.

i  .firebaserc already has a default project, skipping

=== Hosting Setup

Your public directory is the folder (relative to your project directory) that
will contain Hosting assets to be uploaded with firebase deploy. If you
have a build process for your assets, use your build's output directory.

? What do you want to use as your public directory? dist
? Configure as a single-page app (rewrite all urls to /index.html)? Yes
? File dist/index.html already exists. Overwrite? Yes
✔  Wrote dist/index.html

i  Writing configuration info to firebase.json...
i  Writing project information to .firebaserc...

✔  Firebase initialization complete!

MYMAC-M-34RS:WeatherDemo user$ firebase deploy

=== Deploying to 'alarm-6b7dc'...

i  deploying hosting
i  hosting: preparing dist directory for upload...
✔  hosting: 15 files uploaded successfully

✔  Deploy complete!

Project Console: https://console.firebase.google.com/xxx/xxx-6b7dc/overview
Hosting URL: https://xxx-6b7dc.firebaseapp.com
MYMAC-M-34RS:WeatherDemo user$ 

Answer 1

您的项目创建（和初始部署）似乎一切正常。你在https://alarm-6b7dc.firebaseapp.com 得到的是默认的index.html 页面。您现在必须修改此 index.html 并添加与您的 Angular 应用程序对应的文件夹和文件。

您只需在找到 index.html 的同一文件夹中（在 Firebase 项目中；即在 Projects/experiments/Angular-5/Demo/WeatherDemo/dist 下）从 angular 复制您的分发文件夹。

然后使用正确的命令重新部署，即firebase deploy

您可以查看 CLI 命令文档：https://firebase.google.com/docs/cli/#deployment

Answer 2

我也遇到了同样的问题。您可以在构建之前或之后初始化 Firebase。但问题是，当它要求覆盖 index.html 时，我们必须回答“否”。在这里，我将公共目录指定为 dist/MyAngularProject，因为在构建 Angular 应用程序构建文件之后，将在 MyAngularProject 文件夹中创建。

? What do you want to use as your public directory? dist/MyAngularProject
? Configure as a single-page app (rewrite all urls to /index.html)? Yes
? File dist/MyAngularProject/index.html already exists. Overwrite? No
i  Skipping write of dist/MyAngularProject/index.html

i  Writing configuration info to firebase.json...                                                                       
i  Writing project information to .firebaserc...

+ Firebase initialization complete!

Answer 3

这是因为您在覆盖选项中选择了“是”。

? File dist/index.html already exists. Overwrite? Yes

所以默认的 firebase index.html 文件覆盖了您的 index.html 文件。 您必须重新创建 index.html 文件，然后使用 firebase deploy 重试。