Fatal编程技术网
  • javascript/
  • 使用`<；预加载动态Javascript`import（modules）`；链接/>；`在HTML中？

使用`<；预加载动态Javascript`import（modules）`；链接/>；`在HTML中？

javascript html ecmascript-6

使用`<；预加载动态Javascript`import（modules）`；链接/>；`在HTML中？,javascript,html,ecmascript-6,preload,Javascript,Html,Ecmascript 6,Preload,HTML特性可用于在文档加载时获取脚本和静态数据，但它似乎根本没有任何针对Javascript模块的规定 谷歌最近发布了一项功能来解决这个问题，同时他们也明确解释了为什么rel=“preload”不适用于模块： Firefox对该功能的支持尚不清楚，但它显然是WHATWG HTML标准的一部分： 可以是的，rel=“modulepreload”也适用于Javascript中的动态import（）调用。它应该将获取的模块放在用于所有静态和动态导入的JS模块映射中 如果您阅读了链接的规

HTML特性可用于在文档加载时获取脚本和静态数据，但它似乎根本没有任何针对Javascript模块的规定

谷歌最近发布了一项
功能来解决这个问题，同时他们也明确解释了为什么
rel=“preload”
不适用于模块：

Firefox对该功能的支持尚不清楚，但它显然是WHATWG HTML标准的一部分：

可以
是的，
rel=“modulepreload”
也适用于Javascript中的动态
import（）
调用。它应该将获取的模块放在用于所有静态和动态导入的JS模块映射中



如果您阅读了链接的规范，您会注意到它特别给出了以下示例：

下面的代码显示了如何将
modulepreload
链接与
import（）
结合使用，以确保提前完成网络抓取，从而在调用
import（）
时，模块已准备就绪（但未评估）：



看真棒的东西





<link rel="modulepreload" href="awesome-viewer.mjs">

<button onclick="import('./awesome-viewer.mjs').then(m => m.view())">
  View awesome thing
</button>