web-dev-qa-db-ja.com

Firebaseホスティングでアプリが表示されませんか?

私はFirebaseを使い始めたばかりで、アプリをFirebaseにデプロイしようとしています。すべての手順を実行しました。しかし、何らかの理由で私のアプリが表示されません。 Webアプリの代わりにウェルカムモーダルを取得しています。これが画像です: enter image description here

enter image description here

18
user7960664

index.htmlを選択すると、自分自身が変更されました"Y" while initializing the firebase。それは基本的にあなた自身のインデックスファイルをこれに置き換えました。インデックスファイルを確認して置き換え、次回はindex.htmlファイルを上書きしないでください。それはうまくいくでしょう。

6
Stepres stepres

展開する手順は次のとおりです

ステップ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'を押すだけでキャッシュが消去されます。

3
Himanshu

Firebaseホスティングでアプリが表示されませんか?

この問題には2つの理由が考えられます

最初のステップ:

Index.htmlを含むパブリックフォルダー(firebase.jsonで定義)の「dist」がfirebase initコマンドによって変更されていないことを確認します。そうである場合は、元のプロジェクトのindex.htmlに置き換えます。

参照用(distは標準ですが、異なる場合があります)

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

2番目のステップ:

プロジェクトの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>

3番目のステップは、コマンドfirebase deployを実行します

楽しい ! ;)

2
Hammad J

私も同じ問題に直面しました。私の場合、問題はfirebaseではありませんでした。キャッシュをクリアするだけで解決しました。

2
Varun Kumar P

私はこの問題に遭遇し、

Firebase initコマンドを使用した後に誰かが同じ問題に遭遇した場合、

パブリックフォルダ内のindex.htmlファイルを確認してください(反応用)。

firebaseによって上書きされた可能性があります。

既存のindex.htmlファイルを上書きしないようにfirebaseに指示するには、

firebaseが既存のindex.htmlファイルを上書きするかどうかを尋ねるときに「N」と入力します

1
aj go

私自身の問題は、アプリの場所への絶対パスfirebase initは相対パスのみを取るようです。

1
Ditiz

Angular v6 CLIプロジェクトにより、共有コードベースを持つ複数のアプリを簡単に作成できるようになりました。したがって、dist内の新しいフォルダー。

DotGitignoreの答えを引用:

Ng build --prodは、プロジェクトの場所があるこの場所にdistと別のサブフォルダーを作成することがわかりました。

ここでそれを修正する方法を確認してください https://stackoverflow.com/a/50360478/1165224

0
Mario Orozco

Firebase initを実行すると、Firebaseはプロジェクトフォルダーにファイル構造を作成し、選択に応じて、パブリックファイル用の/ publicフォルダー(または指定した場合は別の名前)を作成します。その/ publicフォルダー内には、表示されているウェルカムメッセージを含むindex.htmlファイルも作成されます。アプリファイル(Webページなど)を取得し、それらをパブリックフォルダーに移動して、index.htmlファイルをそれらと一緒に置き換える必要があります。これを実行した後、コマンド「firebase deploy」を実行すると、コマンドが更新され、アプリが表示されます。

0
Dan N.

このスクリーンショットの内容が表示されている場合は、Firebaseによって生成された別のindex.htmlファイルがあり、それは自分のファイルではなく、このファイルを指しています。修正方法は次のとおりです。

  1. Firebaseで生成されたindex.htmlを削除して、独自のものを保持します。
  2. firebase deployを使用して再デプロイ
0
Toby Ladislas

コマンドfirebase initの後、publicまたはdistフォルダに移動し、firebase関連ファイルを除くすべてのファイル(フォルダではない)を選択し、distまたはpublicフォルダにコピーします。このコマンドを実行した後、firebase deployを実行してしばらく待ちます。完了後、言及されているURLに移動すると、作業中のアプリが見つかります。

0
muhammad asif