Clientlib is not adding for Component specific structure

[Tessa_learner1]

Hi,

I have created locator component for my project. I need to add some .css & .js styles to the locator component. So I have created Clientlib-locator(cq:ClientLibraryFolder) under /apps/myproject/clientlibs but the styles I have put in clientlib-locator is not adding into my webpage. Can someone address this and tell me what went wrong ??

[milind_bachani · Accepted solution]

Hi @Tessa_learner1 ,

Once clientlib is created you need to invoke in sightly in component.html using :

<sly data-sly-use.clientLib="${'/libs/granite/sightly/templates/clientlib.html'}">

<!--/* for css+js */-->
<sly data-sly-call="${clientLib.all @ categories='your.clientlib'}" data-sly-unwrap />

<!--/* only js */-->
<sly data-sly-call="${clientLib.js @ categories='your.clientlib'}" data-sly-unwrap />

<!--/* only css */-->
<sly data-sly-call="${clientLib.css @ categories='your.clientlib'}" data-sly-unwrap />

</sly>

you can also refer the tutorial:
http://www.aemcq5tutorials.com/tutorials/create-client-libraries-in-aem/

This shows how the folder structure should be and how are you supposed to call the clientlib in component's html markup. Also, if it does not show up on publisher you might have missed allowProxy=true property for clientlib.

Let us know if that does not fix your issue. 

Thanks

[Tessa_learner1]

Thanks @milind_bachani  It worked