仅加载当前页面中的组件脚本答案

【问题标题】：load only components scripts that are in the current page仅加载当前页面中的组件脚本
【发布时间】：2016-07-26 11:48:20
【问题描述】：

我想要实现的是，如果我有 2 个组件节点：

组件1
- 客户端库
  - component1.js
组件2
- 客户端库
  - component2.js

我将它们拖到page1中，然后在生成page1时，导航到page1时只会加载component1.js和component2.js。

我看到的一种方法是使用自定义Tag Library，如下所述：http://www.icidigital.com/blog/best-approaches-clientlibs-aem-part-3/

我有两个问题：

1) AEM 中是否有执行此操作的现有功能？

2) 如果没有，创建此类自定义Tag Library 的最简单方法是什么？

编辑：

假设不能只包含所有组件 clientLib，而是只加载那些添加到页面的组件。

【问题讨论】：

这在 AEM 中开箱即用。这是official documentation for AEM 6.2，也适用于以前的版本。
它只描述了如何加载特定类别的脚本..我找不到如何加载当前页面中组件的脚本的参考，所以其他具有相同类别的组件脚本是不在那个页面就不会被加载，ty
组件特定脚本应定义为与该组件对应的唯一类别。这样当您跨页面使用相同的组件时，这些脚本就会被包含在内。如果您为多个组件的脚本提供一个通用类别，那么它们应该为所有这些组件提供一些通用功能。

标签： aem

【解决方案1】：

没有内置功能可以做到这一点。虽然我听说 clientlib 基础架构正在考虑重新编写，所以我很乐观地认为将来会添加类似的东西。

我们已经创建了一个“延迟脚本标签”，而且我知道其他公司已经创建了一个“延迟脚本标签”。我们的标签是一个非常简单的标签，它像 clientlib 一样包含一大块 html，将其添加到唯一的列表中，然后在页脚的 out 调用中，将其全部吐出。

这是扩展 BodyTagSupport 的简单标签实现的核心。然后在您的页脚中获取属性并将其写出来。

public int doEndTag() throws JspException {
    SlingHttpServletRequest request = (SlingHttpServletRequest)pageContext.getAttribute("slingRequest");

    Set<String> delayed = (Set<String>)request.getAttribute(DELAYED_INCLUDE);

    if(delayed == null){
        delayed = new HashSet<String>();
    }

    if(StringUtils.isNotBlank(this.bodyContent.getString())){
        delayed.add(this.bodyContent.getString().trim());
    }

    request.setAttribute(DELAYED_INCLUDE, delayed);
    return EVAL_PAGE;
}

【讨论】：

【解决方案2】：

理论上可行的方法是在您的页面组件/抽象页面组件中编写脚本来执行类似的操作 -

第一步：字符串路径 = currentPage.getPath()

Step2 : 查询组件的路径（一种方法是让主列表在 sling:resourceType 上执行 contains 子句）

第 3 步：用户资源解析器在第 3 步中解析 resourceType，这将为您提供应用下的资源。

第四步：从上述资源中获取主类型为 cq:ClientLibraryFolder 的子资源

第 5 步：从第 4 步中的客户端库资源中获取类别并包含其中的 JS

您实际上可以编写一个模型来使组件资源适应 clientLibrary 以实际清理代码。

如果您需要实际代码，请告诉我，我可以在空闲时间编写。

【讨论】：