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

时间:2018-04-27 10:03:22

标签: angular firebase firebase-hosting

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

enter image description here

在部署应用时无法找到问题。

任何提示如何解决此问题?

下面是我的日志,同时在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/project/alarm-6b7dc/overview
Hosting URL: https://alarm-6b7dc.firebaseapp.com
MYMAC-M-34RS:WeatherDemo user$ 

3 个答案:

答案 0 :(得分:1)

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

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

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

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

答案 1 :(得分:1)

我也面临着同样的问题。您可以在构建之前或之后初始化Firebase。但是,要是它要求覆盖index.html时,我们必须回答“否”。在这里,我将公共目录指定为dist / MyAngularProject,因为在构建角度应用程序后,将在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!

答案 2 :(得分:0)

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

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

因此默认的Firebase index.html文件将覆盖您的index.html文件。 您必须重新创建index.html文件,然后使用firebase deploy重试。