Expand my Community achievements bar.

SOLVED

Clientlibs not getting minified in AEM 6.5.6

Avatar

Level 2

The .min.js extension is getting added to the client library , but the js files are not minified.
AEM version: 6.5 and service pack version is 6.5.6.
In OSGI config HTML client library manager, minify option is already enabled with jsProcessor= min:gcc 

1 Accepted Solution

Avatar

Correct answer by
Employee Advisor

The standard AEM archetype provides a pre-defined structure for the frontend build already, see https://experienceleague.adobe.com/docs/experience-manager-core-components/using/developing/archetyp...

 

specifically the modules "ui.frontend.general", "ui.frontend.react" and "ui.frontend.angular"

View solution in original post

13 Replies

Avatar

Employee Advisor

Steps:1

Please check error.log file there you might see some error associated with that clientlib.

When I had issue with minification , I saw error message in error.log file and then I took necessary steps to fix.

 

Step:2

To troubleshoot the issue please follow the below steps   -

 

a. AEM 6.5 uses following closure-compiler-v20190121.jar for js minification, also highlighted in below screenshot -

DEBAL_DAS_0-1652862323540.png

 

b. If we take a closure look , we could see com.google.javascript is part of this closure compiler bundle.

c. Next you  can download the bundle:closure-compiler-v20190121.jar from aeminstance\crx-quickstart\launchpad\felix\bundle290\version0.0\bundle.jar-embedded. Bundle ID may vary in your case-

DEBAL_DAS_0-1652939688046.png

 

d. To understand the minification issue , you can execute below command to compile the Javascript file -

     java -jar compiler.jar --js hello.js --js_output_file hello-compiled.js

[https://developers.google.com/closure/compiler/docs/gettingstarted_app]

It may throw error during compilation and it will help you why minification isn't working.

 

 

 

Avatar

Level 2

Hi @DEBAL_DAS , this is the error that is coming in the logs:

18.05.2022 13:49:18.996 *ERROR* [0:0:0:0:0:0:0:1 [1652861958525] GET /etc.clientlibs/deg/clientlibs/clientlib-base.min.js HTTP/1.1] com.google.javascript.jscomp /apps/deg/clientlibs/clientlib-base.js:849: ERROR - This language feature is only supported for ECMASCRIPT6 mode or better: block-scoped function declaration.
function checkDOMChangeLogin()
^

There were other errors regarding the usage of let keyword which I already have neutralized. But this is the only error coming up now.
Any suggestions on how to neutralize this one?

Thanks

Avatar

Employee Advisor

You can give a try by adding either one of the below option in that clientlibrary folder: 

a.

jsProcessor=[min:gcc;languageIn=ECMASCRIPT_2016;languageOut=ECMASCRIPT_2016;compilationLevel=simple;obfuscate=true]

b.

 jsProcessor=[min:gcc;obfuscate=true;languageIn=ECMASCRIPT_2019;languageOut=ECMASCRIPT3]

 

 

One more request please talk to your Front End developers and Front End architect about this error, if they could fix this issue at code level.

Avatar

Level 2

Hi @DEBAL_DAS ,
I checked the bundles that you have mentioned and I saw that closure-compiler-v20190121.jar  is not being used in my case for minification. Instead of that, .,yuicompressor-2.4.8-granite-003.jar is being used. Any suggestions on how to bring closure-compiler-v20190121.jar  instead of  .,yuicompressor-2.4.8-granite-003.jar ?

 

nkp1_0-1652868382408.png

 

 

Avatar

Employee Advisor

Are you seeing Adobe Granite UI Clientlibs - Google Closure Compilercom.adobe.granite.ui.clientlibs.processor.gcc in /system/console/bundles like the below one -

DEBAL_DAS_0-1652869324059.png

 

Avatar

Level 2

Hi @DEBAL_DAS ,

nkp1_0-1652870053958.png

I have looked into the same one as mentioned by you and I am also having the same 

closure-compiler-v20190121.jar like you have mentioned.
Can you help me with the next steps.

Thanks!

Avatar

Employee Advisor

You can give a try by adding either one of the below option in that clientlibrary folder: 

a.

jsProcessor=[min:gcc;languageIn=ECMASCRIPT_2016;languageOut=ECMASCRIPT_2016;compilationLevel=simple;obfuscate=true]

b.

 jsProcessor=[min:gcc;obfuscate=true;languageIn=ECMASCRIPT_2019;languageOut=ECMASCRIPT3]

 

 

One more request please talk to your Front End developers and Front End architect about this error, if they could fix this issue at code level.

Avatar

Level 2

Hi @DEBAL_DAS ,
I have tried both the approaches that you have mentioned, but still the files are not getting minified.
Can you suggest some other method please.

thanks

Avatar

Employee Advisor

I would do the minification outside as part of the Frontend build process; I would not rely on the AEM features, because there are better ways and tools to do so.

 

(Note: hearsay, I am not a frontend engineer)

Avatar

Employee Advisor

Yes @Jörg_Hoh , in our current and last project minification is part of Frontend build process.

Avatar

Level 2

Can you elaborate on the Frontend build process please

Avatar

Correct answer by
Employee Advisor

The standard AEM archetype provides a pre-defined structure for the frontend build already, see https://experienceleague.adobe.com/docs/experience-manager-core-components/using/developing/archetyp...

 

specifically the modules "ui.frontend.general", "ui.frontend.react" and "ui.frontend.angular"