clientlibs 파일의 경로 가져 오기

Question

here과 같은 애셋을 미리로드하려고합니다.

나는 /apps/foundation/components/page/head.html에 다음을 포함했다 :

<sly data-sly-use.appConfig="${'../../../utils/AppConfig.js'}"> 
    <link rel="preload" href="${appConfig.assetsURL}/etc/designs/myapp/jquery/jquery-3.1.1.min.js"> 
    <link rel="preload" href="${appConfig.mainStyle}/mainstyle.css"> 
    </sly> 

지금 포함될 필요가 최종 파일은 페이지에 따라 다른 경로를 가지고, clientlibs.js 및 각 페이지에 함께 넣어 clientlibs.css 있습니다. 최근 게시물 (/content/recent-posts.html)의 경로는 질문은 /etc/designs/myapp/posts/clientlibs.js

반면 홈페이지 (/content/homepage.html)에 대한 예를 들어 clientlibs.js의 경로 내가 구도를 어떻게 /etc/designs/myapp/homepage/clientlibs.js입니다 이 애셋의 URL은 무엇입니까?

this gist에서 전역 변수를 사용해 보았지만 행운은 없었습니다. 어느 쪽도 자산에 올바른 길을 되돌려주지 않습니다.

Answer 1

clientlibs 경로를 페이지에 매핑하는 것이 응용 프로그램마다 다르기 때문에 페이지 유형을 감지하고 clientlib을 필요로하는 방법을 구현해야합니다.

clientlib 카테고리를 사용하여 각 페이지 유형에 대해 올바른 비트를 조합 할 수 있습니다 (https://docs.adobe.com/docs/en/aem/6-3/develop/the-basics/clientlibs.html 및 clientlib 포함이 구현되는 방법은 /libs/granite/sightly/templates).

또한 AEM 6.3을 사용하는 경우 편집 가능한 템플릿을 사용하고 클라이언트 수준을 템플릿 수준으로 설정하는 것을 고려하십시오.

이미 clientlib 범주를 사용하고 단지 clientlib의 출력을 재 작성하려는 사용자가 URL을 추출하기 위해 자신의 도우미를 만들 수 있습니다 포함하는 경우 :

package apps.test; 

import javax.script.Bindings; 

import java.util.ArrayList; 
import java.util.List; 
import java.util.regex.Matcher; 
import java.util.regex.Pattern; 

import org.apache.sling.scripting.sightly.pojo.Use; 

import libs.granite.sightly.templates.ClientLibUseObject; 

public class Test implements Use { 

    ClientLibUseObject obj = null; 
    Pattern pattern = Pattern.compile("(?:href|src)=\"(.*?)\""); 
    List<String> srcs = null; 

    public void init(Bindings bindings) { 
     obj = (ClientLibUseObject) bindings.get("clientLibUseObject"); 
    } 

    public List<String> getSrcs() { 
     if (srcs == null && obj != null) { 
      srcs = new ArrayList<>(); 
      String tmp = obj.include(); 
      Matcher matcher = pattern.matcher(tmp); 
      while (matcher.find()) { 
       srcs.add(matcher.group(1)); 
      } 
     } 
     return srcs; 
    } 
} 

을 다음 스크립트에서 호출 :

<link data-sly-use.clientLibUseObject="${'libs.granite.sightly.templates.ClientLibUseObject' @ categories='jquery,jquery-ui', mode='all'}" 
      data-sly-use.rewriter="${'Test' @ clientLibUseObject=clientLibUseObject}" 
      data-sly-repeat="${rewriter.srcs}" 
      rel="preload" href="${item}"/>