web-dev-qa-db-ja.com

Angular 8.3+でindex.htmlを環境に応じて置き換える方法は？

Jhipster、Spring Boot、Angularを使用してセットアップされたアプリケーションに取り組んでいます

アプリがdevまたはprodのどちらで実行されているかに応じて、何かに異なる公開鍵を設定する必要があります。

私はかなり長い間、angular.jsonに座っており、すべてのangular.jsonベースのソリューションを試し、多数のソリューションをグーグルで検索しました。

これがangular.jsonで試したものです：

  • 「インデックス」の古い使用法
  • fileReplacements
  • 新しいインデックスの「入力」「出力」オプション
  • 後者では、考えられるインデックスファイルへのパス（ファイル名のみを含む）を書き込む方法をすべて繰り返してきました。

3つのインデックスファイルはすべて、webappディレクトリにあります。
angular.json（関連ビット）：

  "root": "",
  "sourceRoot": "src/main/webapp",
  "projectType": "application",
  "architect": {
    "build": {
      "builder": "@angular-devkit/build-angular:browser",
      "options": {
        "index": "src/main/webapp/index.html",
        "configurations": {
          "production": {
            "index": {
              "input": "src/main/webapp/index-prod.html",
              "output": "src/main/webapp/index.html"
            }
          }
      },
        "scripts": [

        ],
        "styles": [
          "./src/main/webapp/teststyle.css"
        ]
      }
    }
  }

プロジェクトにはenvironment.tsファイルがありませんが、enableProdMode（）が呼び出され（webpackマジックを通じて）、期待どおりに動作します。

私に何ができる？理想的には、環境間で再構築する必要がないことを望みますが、この時点では、index.htmlファイルが自動的に変更される限り、それを採用します。

angularwebpackjhipsterangular8
3
Marvin Falkner

Indexオプションは、次のように長形式をサポートしています。

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

例：

"architect": {
  "build": {
    "options": {
      "index": "src/index.html", // non production index
    },
    "configurations": {
      "production": {
        "index": { // production index replacement
          "input": "src/index.prod.html",
          "output": "index.html"
        }
      }
    }
  }
}

この機能Angular Cli v8.2.0-next. に追加されました。

関連するGitHubの問題： https://github.com/angular/angular-cli/issues/14599

9
fridoo