确保组件的客户端 lib 文件仅在组件存在时才加载到页面上的最佳方法是什么？
What is the best way to ensure a component's client lib files only load on the page when the component is present?
我是 AEM 新手。目前，我们网站上的每个页面都有一个模板。所有组件都有类别 "project_name.components"，我在头文件中调用客户端库：
<sly data-sly-call="${clientLib.css @ categories='project_name.components'}" />
<sly data-sly-call="${clientLib.js @ categories='project_name.components'}" />
然而，我有一个面包屑组件，它并不在每个页面上，但正如预期的那样，它的客户端库文件无论如何都会显示，并导致现有默认面包屑 styles/scripts 出现一些问题。
我已经为新的面包屑组件指定了一个测试类别名称 "project_name.breadcrumbs"。有没有办法在同一个头文件中的某种类型的 if/else 语句中使用此类别名称，如果面包屑已被拖到页面上，该语句将只调用面包屑客户端 lib 文件？
一些想法：
- 最简单的方法是将客户端库作为使用它的组件的一部分包含进来，而不是将其包含在其他地方。这样做的缺点是 CSS 您可能希望在页面的 HEAD 部分尽早加载，直到 BODY 中的某个地方才会出现。
- 如果您的 CSS 样式影响了它不应该影响的东西，那么 CSS 样式需要有足够的选择器，这样它就不会破坏它不应该应用的东西。也许您可以在面包屑中添加 class，并使所有样式仅应用于具有 class 的标签下的内容。如果您以这种方式更改 CSS ，当页面不使用面包屑时，它不会对页面产生负面影响（尽管如果它不是将被加载的东西，它可能会膨胀您的页面足迹浏览器缓存以备将来使用）。
- 否则，您可以添加在页面级别运行的逻辑，该逻辑将检查节点并查看包含哪些组件，然后添加条件逻辑以仅在页面使用该组件时添加客户端库。但那是更多的后端工作。因此，您可以按照您的建议添加 if/else 语句，但由您来编写其背后的代码——据我所知，没有任何内置的内容可以有条件地进行检查。
我是 AEM 新手。目前，我们网站上的每个页面都有一个模板。所有组件都有类别 "project_name.components"，我在头文件中调用客户端库：
<sly data-sly-call="${clientLib.css @ categories='project_name.components'}" />
<sly data-sly-call="${clientLib.js @ categories='project_name.components'}" />
然而，我有一个面包屑组件，它并不在每个页面上，但正如预期的那样，它的客户端库文件无论如何都会显示，并导致现有默认面包屑 styles/scripts 出现一些问题。
我已经为新的面包屑组件指定了一个测试类别名称 "project_name.breadcrumbs"。有没有办法在同一个头文件中的某种类型的 if/else 语句中使用此类别名称，如果面包屑已被拖到页面上，该语句将只调用面包屑客户端 lib 文件？
一些想法：
- 最简单的方法是将客户端库作为使用它的组件的一部分包含进来，而不是将其包含在其他地方。这样做的缺点是 CSS 您可能希望在页面的 HEAD 部分尽早加载，直到 BODY 中的某个地方才会出现。
- 如果您的 CSS 样式影响了它不应该影响的东西，那么 CSS 样式需要有足够的选择器，这样它就不会破坏它不应该应用的东西。也许您可以在面包屑中添加 class，并使所有样式仅应用于具有 class 的标签下的内容。如果您以这种方式更改 CSS ，当页面不使用面包屑时，它不会对页面产生负面影响（尽管如果它不是将被加载的东西，它可能会膨胀您的页面足迹浏览器缓存以备将来使用）。
- 否则，您可以添加在页面级别运行的逻辑，该逻辑将检查节点并查看包含哪些组件，然后添加条件逻辑以仅在页面使用该组件时添加客户端库。但那是更多的后端工作。因此，您可以按照您的建议添加 if/else 语句，但由您来编写其背后的代码——据我所知，没有任何内置的内容可以有条件地进行检查。