Angle-cli 工具的—— base-href 参数和—— department-url 参数之间的区别是什么

Angular 的文档告诉我们，当要部署到子文件夹中时，应该在 Angular 应用程序的生产版本中使用 --base-href参数:

如果将文件复制到服务器子文件夹中，请附加生成标志, 并适当设置 <base href>。

例如，如果 index.html在 /my/app/index.html的服务器上, 像这样把基准 href 设置为 <base href="/my/app/">。

Https://angular.io/guide/deployment

但是，该角度-cli 有 --deploy-url参数。该工具的文档将其描述为:

将部署文件的 URL。

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

当应用程序将要部署在子文件夹中时，我看到过使用 --deploy-url而不是 --base-href的解决方案。

# 问题 #

角斜面工具的 --base-href和 --deploy-url参数有什么区别? 我应该什么时候使用它们？

142432 次浏览
小开
  • 路由使用 Base-href
  • Department-url 是针对资产的。

在大多数情况下，basehref 就足够了。

请看这些帖子:

小开

要将脚本放入“ /test/app1/script/”文件夹中，我使用以下 指挥官:

ng build --prod --base-href /test/app1/ --deploy-url /test/app1/script/

因此，我的应用程序可以在 https://example.com/test/app1/访问，但是我的 JS 脚本和 CSS 在 https://example.com/test/app1/script/目录中。

小开

如果我想使用 /users作为路由器的应用程序基础，使用 /public作为资产的基础,

ng build --prod --base-href /users/ --deploy-url /public

有关详细示例，请参阅 Shekhar Gulati 的 blog。

小开
最佳答案

这里的答案并不完全准确、过时，也没有给出完整的解释。

我应该什么时候使用每一个？

一般使用 --base-href，因为 --deploy-url

  1. 不推荐使用 Angular v13
  2. 将降低构建速度(尽管，可能不太重要)
  3. 在 “定位相对模板(HTML)资产和相对获取/XMLHttpRequest”中没有 base href的好处

如果你需要的网址不同于放置资产的地方，正式文件建议设置 APP_BASE_HREF手动(和不同，例如设置 --base-href到 /public/和 APP_BASED_HREF到 /users/如果你将在 https://example.com/public/的角度文件，但你想网络应用的网址是 https://example.com/users/)

角斜刀的 --base-href和 --deploy-url参数有什么区别？

上面我已经列出了三个不同之处。

正如您在问题中已经指出的，--base-href在 index.html中设置 <base href>(详细信息请参阅 Mozilla 文档，有关影响请参阅 社区维基) ，而 --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) ，使用一个资产的相对链接，例如，一个包含 <img src="assets/logo.jpg">的 header.component.html，但是你使用 --deploy-url /public/，链接将不会是前缀，并会给你一个破碎的图像。如果使用 --base-href /public/设置 <base href="/public/">，那么这将会起作用。

小开

从角度 v12移动到角度 v14:

在 V12之前

.html:

<base href="/">  // overriden by angular.json

Package.json:

"start": "ng serve --base-href=/my-app/"  // obsolete

V14之后

Json:

"baseHref": "/"  // used for finding .js files

应用程序模块:

providers: [{ provide: APP_BASE_HREF, useValue: '/my-app/' },  // used for routing

用 angular.json 指定 "deployUrl"对我没用。


提交答案