index.htmlを環境ごとに置き換える[Angular]

きっかけ

環境によって、画面デザインを変えようとしたが、
angular.jsonのfileReplacementsで、enviroment.tsと同じような感じで置き換えようとしたが、
以下のように、htmlの拡張子は対応していないとのエラーが発生しました。
そのため、別の方法を考えました。

Error: Schema validation failed with the following errors:
  Data path "/fileReplacements/0/replace" must match pattern "\.(([cm]?[jt])sx?|json)$".

解決方法

バージョンはAngular18になります。

angular.jsonのbuildの設定のところに、以下の設定を加えることで解決しました。
キー階層的にはfileReplacementsを使う場所と同じ階層です。

            "staging": {
              "index": {
                "input": "src/index.staging.html",
                "output": "index.html"
              },

inputに、実際に出力するhtmlファイルのパスを指定し、
outputは、ビルド後のindex.htmlのパスを書いているだけなので、index.htmlと書けば問題ないです。