Migration CQ 5.5 -> AEM 5.6.1: LESS compiler issue

[Dmitry_Cherkas]

Hi,

We are moving our project from CQ 5.5 to AEM 5.6.1 and ran into issues with LESS compiler (as far, as I know, in AEM 5.6.1 LESS was updated to 1.3.3).

In 5.5 we had a common clientLib, which contained all the mixins and vars declarations(call it common.less.rules), it was then embedded in other clientLibs as follows:

<?xml version="1.0" encoding="UTF-8"?> <jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" jcr:primaryType="cq:ClientLibraryFolder" categories="my.custom.library" embed="common.less.rules"/>

And it works perfectly fine in 5.5, but in 5.6.1 we are getting the following errors in compiled css files:

/***************************************************** LESS compilation failed due a JavaScript error! Input: /etc/designs/widget.less Error: @myVar is undefined (uncompiled LESS src is included below) *****************************************************/

This blogpost was very usefull: http://www.citytechinc.com/us/en/blog/2012/08/less_css_in_adobecq.html. While debugging com.day.cq.widget.impl.LessCompiler class I figured out that it compiles all *.less files, specified in css.txt separately, not including any embedded libraries, which leads to JavaScript error, mentioned above.

So my question is: how to tell LessCompiler that it should embed my common.less.rules prior to compilation. The only workaroud, I have found so far is to add @import statement to each *.less, but I hope there is a easier way, since it was working correctly in 5.5 without any import statements.

If my question is not clear enough, please ask, I will provide additional details.

[Ojjis · Accepted solution]

Hello, I've experienced the same thing.
One way of solving this is to have the separate less files include the variable file at the top like:
 

----------------- /* in mylessfile.less */ ------------------ @import "/etc/designs/my/site/clientlib/css/muVariables.less"; .myClass { .myVariable(none); }

That will work :)

[Dmitry_Cherkas]

Thanks for your reply.

I have looked through the Less compiler implementation(com.day.cq.widget.impl.LessCompiler), used by CQ 5.5 and AEM 5.6.1 As it appears, in 5.5 the compiler was first merging clientLib to a single file and then compiling the result, while the new implementation compiles each *.less file, specified by clientLib separately. So explicitly specifying @import is the only solution.