Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

Loading clientlibs by component

ariellea4070516
Level 3
Level 3

In AEM 6.4, is there a way to call clientlibs by component instead of loading all CSS and JS on every page?

7 Replies
smacdonald2008
Level 10
Level 10

You can call a clientlib from a specific component.

ariellea4070516
Level 3
Level 3

So using ui:includeClientLib then? Ok, I'll need to find a way to rewrite the src's and href's because that approach exposes the internal structure of the application.

ariellea4070516
Level 3
Level 3

smacdonald2008​ I'm curious, what method would you use to call a clientlib from a specific component?

Ravi_Pampana
Community Advisor
Community Advisor

Hi,

You can add clientlibs folder under each component and add category name to clientlibs folder like below

categories="[componentspecificname]"

Add the clientlibs inside component jsp/html

JSP:

<cq:includeClientLib categories="categoryname" /> -- This includes both js/css files

<cq:includeClientLib js="categoryname"/> -- To include only js

<cq:includeClientLib css="categoryname"/> -- To include only css

Sightly:

HTL and ClientLibs

This will include multiple js/css files on the page as each component will include a js/css files. Also, if clientlibs are added in /apps user everyone should have read access of /apps for files to load in publisher or clientlibs needs to create under /etc/designs

ariellea4070516
Level 3
Level 3

I thought ‘cq’ was deprecated since AEM 5.3. Shouldn’t we be using ui now?

ariellea4070516
Level 3
Level 3

Also, this solution injects clientlibs in the body of the page, which defeats the purpose of a component-based architecture (increasing the performance of an app) by forcing the client to re-render the page. And adding <link .. /> to the body is invalid, 'link' tags should only be added in the head of a document.