Aurelia的需求元素包括内联的外部资源

Aurelia's require element includes external resource inline?

本文关键字：外部 资源 元素 需求 Aurelia 包括内      更新时间：2023-09-26

在完成入门教程时，有一点"需要"引导库（CSS）：

<require from="bootstrap/css/bootstrap.css"></require>
<require from="font-awesome/css/font-awesome.css"></require>

当我查看Chrome的检查器时，我找不到这些CSS文件作为来源。相反，它似乎全部内联在页面中。

这是真的，还是只是调试器的问题？如果是 - 这不会影响浏览器中的缓存（CSS 需要重新下载）？

当通过

<require> 标记导入 CSS 资源时，ES6 模块加载器（由 SystemJS 填充）用于下载 CSS。 这是一个标准的XMLHttpRequest，请求将由浏览器的标准缓存机制缓存。下载 CSS（文本）后，Aurelia 将其填充到 <style> 元素中，并以适当的方式将<style>元素附加到 DOM 中，具体取决于是否使用了 scoped 属性以及该元素是否在影子 DOM 中。

相关代码在这里。

这种方法的好处是 CSS 导入在相对路径、捆绑和缓存方面与其他类型的资源（如 HTML 和 JS）具有一致的行为。 它还使Aurelia能够处理作用域css和影子DOM场景。

相关文章：