网站搜索

angular - 如何在 angular8 SSR 中为带哈希的文件添加动态 link 标签 prefetch


我正在使用 Angular 8 作为 SSR 或 Angular Universal,我们发现很难给主要的 Angular 文件添加动态预取链接标签。

在作为 SSR 构建后,代码会在 index.html 的末尾注入一行类似这样的内容,

<script src="runtime.58b180e8c30580ec9ea9.js" defer></script><script src="polyfills-es5.ea80a4cb53fa86a5c510.js" nomodule defer></script><script src="polyfills.c8c0431bcdc0afdb2644.js" defer></script><script src="scripts.2bbb0f7e81eb835e1cea.js" defer></script><script src="vendor.e7551457890efc085d4b.js" defer></script><script src="main.80bdfc18f9240a3efe5c.js" defer></script></body>

</html>

然而,在 head 标签上我们需要有类似这样的东西

  <link rel="prefetch" as="script" href="/runtime.js">
  <link rel="prefetch" as="script" href="/polyfills-es5.js">
  <link rel="prefetch" as="script" href="/polyfills.js">
  <link rel="prefetch" as="script" href="/scripts.js">
  <link rel="prefetch" as="script" href="/vendor.js">

问题是每个构建都会有不同的哈希值,所以我们需要一个选项在渲染页面之前在服务器上检测哈希。

有什么想法,我们该怎么做这个?

Angular 8 作为 SSR,使用 express.js