firebaseへデプロイしても画面表示が変わらない

初めに

元医療職 → WEB制作者がReact開発で詰まった箇所を日々発信しています！
現在はJISOUというコミュニティに所属してReact開発を学習中。
今回はReact+typescriptで簡易アプリを作成して、firebaseにデプロイしても画面が切り替わりませんでした。
その解決方法をまとめます！

問題点

VSCode上でアプリを作成してfirebase deployをしても画面表示は以下のまま変わらず...

デプロイの際のターミナルへの入力は以下のとおりです。

$ npm run build
$ firebase deploy

解決策

今回解決した方法はfirebase.jsonファイルを編集しました。

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

hostingディレクトリのpublicには現在publicが設定されています。
つまりプロジェクトのpublicフォルダにあるindex.htmlをfirebaseに反映しているそうです。
今回はdistフォルダにあるindex.htmlを反映したかったため、以下のように修正しました。

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

この後以下を入力しました。

$ npm run build
$ firebase deploy

上記を実行することで、作成したプロジェクトがfirebase上に反映されました！！