为什么 Angular 文件包含在 <body> 标签中?

Why are the Angular files included in the <body> tag?

我注意到 Angular 将其脚本文件放在 HTML 的 <body> 部分的 <app-root> 元素之后的 index.html 中。我想知道为什么它放在那里而不是 <head> 部分的开头。

这会减少 页面加载时间,在我看来,因为它会导致 Angular 的代码在 [=33 之前被加载] =] 可能在 <head> 中的所有其他脚本(例如 Google 标签管理器的东西)。这样,页面呈现可以在其他库仍在加载时开始,从而加快呈现速度并提高 SEO 性能。

我找不到 Angular 将其代码注入 angular.json 的选项,所以我想我在这里遗漏了一些东西。

如果我没记错的话,在 index.html 的头部部分包含 Angular 的脚本标签的选项在哪里?

我正在使用 Angular 12.1.3 和节点 14.17.3。

您可以查看源文件中的 index.html 文件,您会发现它实际上几乎是空的。

正文实际上包含一个 app-root 元素,它仅用作引导程序(应用程序发生在该元素上)。

由于脚本在执行之前需要此元素存在,因此需要将它们放在它之后。