1. ホーム
  2. angular

[解決済み] angular-cliのパラメータ --base-href と --deploy-url の違いは何ですか?

2022-07-30 21:38:19

質問

Angularのドキュメントによると、Angularを使うには --base-href パラメータを使うべきであるとドキュメントに書かれています。

サーバーのサブフォルダーにファイルをコピーする場合は、ビルドフラグを付加します。 --base-href を設定し <base href> を適切に設定します。

例えば index.html がサーバ上で /my/app/index.html , に設定し、ベースとなる href を <base href="/my/app/"> のようにします。

https://angular.io/guide/deployment

しかし、angular-cliでは --deploy-url というパラメータがあります。ツールのドキュメントでは、次のように記述されています。

ファイルが配置されるURL。

https://github.com/angular/angular-cli/wiki/build

を使用するソリューションを見たことがあります。 --deploy-url の代わりに --base-href に変更する必要があります。

#質問#

との違いは何ですか? --base-href--deploy-url というパラメータがあります。それぞれをいつ使えばいいのでしょうか?

どのように解決するのですか?

ここにある回答は、完全に正確ではなく、時代遅れで、完全な説明を与えるものではありません。

それぞれいつ使えばいいのですか?

tl;dr 一般的な使い方 --base-href というのは --deploy-url

  1. はAngular v13で非推奨となりました。
  2. はビルド速度を低下させます(ただし、おそらくあまり重要ではありません)。
  3. の利点はありません。 base href "相対テンプレート (HTML) アセットの位置決め、および相対フェッチ/XMLHttpRequests."

アセットが配置されている場所と異なる URL が必要な場合は 公式ドキュメント を設定することをお勧めします。 APP_BASE_HREF を手動で設定することを推奨します (例: set --base-href/public/ であり APP_BASED_HREF から /users/ でAngularファイルを提供する場合は https://example.com/public/ で配信し、ウェブアプリのURLは https://example.com/users/ )

とは何が違うのでしょうか? --base-href--deploy-url のパラメータを指定することができます。

上記ですでに3つの違いを挙げています。

すでに質問で述べているように --base-href を設定します。 <base href>index.html (詳細については Mozilla のドキュメントを参照してください。 を、意味合いについては コミュニティ wiki を参照してください)、一方 --deploy-url の中の相対リンクのプレフィクスは index.html ファイル内の相対リンクに接頭辞を付けます。

例えば、次のような index.html のスニペットです。

<link rel="stylesheet" href="styles.HASH.css">
...
<script src="main.HASH.js" type="module"></script>


とは --deploy-url /public/ と出力されます。

<link rel="stylesheet" href="/public/styles.HASH.css">
...
<script src="/public/main.HASH.js" type="module"></script>


--deploy-url は文字通りリンクの前に付けるだけのようなので、もし代わりに --deploy-url public とすると、出力はかなり使い物にならないでしょう。

<link rel="stylesheet" href="publicstyles.HASH.css">
...
<script src="publicmain.HASH.js" type="module"></script>


最後に、アセットへの相対リンクを使用するテンプレート(HTML)がある場合、例えば header.component.html を含む <img src="assets/logo.jpg"> を含むが --deploy-url /public/ を使用した場合、リンクに接頭辞が付かないため、画像が壊れてしまいます。この場合、代わりに <base href="/public/"> を使って設定するとうまくいきます。 --base-href /public/ .