もっといい方法が有ればコメントで教えて下さい！！

結論

{
  "hosting": {
    "site": "my-project",
    "public": "dist",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "!/login",
        "destination": "/index.html"
      },
      {
        "source": "/login",
        "destination": "/login.html"
      }
    ]
  }
}

問題提起

SPAサイトでindex.html以下とlogin.html以下で分けてbuildしてHostingしたい

まず、それシングルじゃ無いやん。
というツッコミは置いておいて、

Firebase Hostingで特定のURLの場合だけ
index.htmlとは異なるファイルを読み込んで欲しいというニーズが有ったので書いてみます。

除外するpathの書き方

"source": "!/login"

この書き方で/login以外のpathでは/index.htmlが読み込まれるようになります。
ただ、この書き方では/loginにアクセスするとnot foundになってしまうので追記します。

※ "public": "dist"の指定で/index.htmlは/dist/index.htmlが読まれている。


{
  "hosting": {
    "site": "my-project",
    "public": "dist",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "!/login",
        "destination": "/index.html"
      }
    ]
  }
}

/login以外は/index.htmlを読み、/loginは/login.htmlを読み込む

こちらが冒頭の結論のコードと同じものになります。

{
  "hosting": {
    "site": "my-project",
    "public": "dist",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "!/login",
        "destination": "/index.html"
      },
      {
        "source": "/login",
        "destination": "/login.html"
      }
    ]
  }
}

補足

除外pathの複数指定

"source": "!/@(login|lp)"

!/@(path|path)で除外ファイルを複数指定する事が出来ます。

詳しくは下記を参考にしてください。
Firebase Hosting Glob pattern matching

{
  "hosting": {
    "site": "development-concru-react",
    "public": "dist",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "!/@(login|lp)",
        "destination": "/index.html"
      },
      {
        "source": "/login",
        "destination": "/login.html"
      },
      {
        "source": "/lp",
        "destination": "/lp.html"
      }
    ]
  }
}