Adobe AEM - 如何在运行时组合客户端库答案

【问题标题】：Adobe AEM - How to combine clientlibs on the runtimeAdobe AEM - 如何在运行时组合客户端库
【发布时间】：2020-06-23 14:37:35
【问题描述】：

我想根据某些条件在运行时组合页面上的客户端库。例如。我在页面上有以下项目

<link href="a.css" />
<link href="b.css" />

如果我有启用串联的条件，我想将这两个 css 合并为一个。

<link href="combined.css" />

是否可以使用 Adobe Granite HTML Library Manager 或 HTML rewriter 或其他选项？

【问题讨论】：

您可以做的是创建 2 个客户端库。 clientlb1 包含 a.css，clientlib2 包含 a.css 和 b.css。然后你可以根据你的条件渲染你想要的clientlib。
谢谢@AhmedMusallam。但是，这不是一种可扩展的方法，因为我有数百个 css 文件并且每个页面都有不同的条件。我想动态地做。而且，组合可以是任何东西。
嗯，这就是你问的问题。这是为了优化 css 以仅提供特定页面所需的内容吗？如果是这样，您可能会找到一种通过 servlet 对其进行优化的方法。但是问问自己是否需要重构 CSS。所以你可以避免在这里做。
你是对的。寻找优化的CSS。我无法在构建时执行，因为我不知道所有 AEM 组件将在页面上创作。有什么可以指出的例子吗？这真的很有帮助

【解决方案1】：

您可以创建 2 个客户端库并相应地添加 css 文件。在 clientlibs 中使用“embed”属性来呈现在运行时从两个 clientlibs 组合的所有文件。

或者

如果您想单独加载这些文件，请创建 2 个不同的客户端库，包括各自的 css 文件。根据条件加载这些客户端库。

【讨论】：