Less4j not able to compile .less file with base64 png image

201 views
Skip to first unread message

schou...@adaptik.com

unread,
Feb 13, 2014, 11:45:30 AM2/13/14
to wr...@googlegroups.com
Hi,

We are using wro4j to compile less files to css. however we are seeing some errors while compiling base64 image in .less file;
Error also shows image I am trying to process. Please help.


Less4jProcess E ro.isdc.wro.extensions.processor.css.Less4jProcessor process Failed to compile less. Errors are: 
 00000192 Less4jProcess E ro.isdc.wro.extensions.processor.css.Less4jProcessor process com.github.sommeri.less4j.core.parser.AntlrException@9170917[delegee=NoViableAltException(73@[308:1: top_level_element : ( ( mixinReferenceWithSemi )=> mixinReferenceWithSemi | ( namespaceReferenceWithSemi )=> namespaceReferenceWithSemi | ( reusableStructureName LPAREN )=> reusableStructure | ( variabledeclaration )=> variabledeclaration | ruleSet | media_top_level | viewport | keyframes | page | fontface | imports | document | supports );]),source=com.github.sommeri.less4j.LessSource$StringSource@cece65b0,message=no viable alternative at input ':' in stylesheet (which started at 3:1)]

 00000192 Less4jProcess E ro.isdc.wro.extensions.processor.css.Less4jProcessor process com.github.sommeri.less4j.core.parser.AntlrException@73e373e3[delegee=NoViableAltException(73@[308:1: top_level_element : ( ( mixinReferenceWithSemi )=> mixinReferenceWithSemi | ( namespaceReferenceWithSemi )=> namespaceReferenceWithSemi | ( reusableStructureName LPAREN )=> reusableStructure | ( variabledeclaration )=> variabledeclaration | ruleSet | media_top_level | viewport | keyframes | page | fontface | imports | document | supports );]),source=com.github.sommeri.less4j.LessSource$StringSource@cece65b0,message=no viable alternative at input ':' in stylesheet (which started at 3:1)]

 Less4jProcess E ro.isdc.wro.extensions.processor.css.Less4jProcessor process com.github.sommeri.less4j.core.parser.AntlrException@785f785f[delegee=NoViableAltException(161@[606:35: ( ( LPAREN )=> ({...}? => LPAREN (b1= nth | b2= variablereference | b3= INTERPOLATED_VARIABLE ) RPAREN | {...}? => LPAREN (b4= extendTargetSelector ) RPAREN | {...}? => LPAREN (b5= selector ) RPAREN | LPAREN b6= pseudoparameters RPAREN ) | )]),source=com.github.sommeri.less4j.LessSource$StringSource@cece65b0,message=no viable alternative at input ''data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMAAAABECAYAAADX/TrJAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo2NTkyN0I3OTcxODMxMUUzQTc4Qjk5MDdGNDJDN0Q5QSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo2NTkyN0I3QTcxODMxMUUzQTc4Qjk5MDdGNDJDN0Q5QSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjY1OTI3Qjc3NzE4MzExRTNBNzhCOTkwN0Y0MkM3RDlBIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjY1OTI3Qjc4NzE4MzExRTNBNzhCOTkwN0Y0MkM3RDlBIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+c45fLgAAVfFJREFUeNrsvXd8HNW5P/zMzPZetOrVqpYsucm94Aa44Aammk5CaKEFEkooCZACAXJJIIAh9N4NuADuvcqWbElW712r7X1mfufMnFmNFTdyk/u+f7B8Bq92Z2fOnPOU71MPxfM8/B+8KHQo0MGQgyafUac5Hw+KIweLjhj596fXT6* {' in selectors (which started at 610:15)]

Here is the line of code 

@LOGO_TEST_DATA: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMAAAABECAYAAADX/TrJAAAAGXRFWHRTb2Z0d2FyZQB..


Alex Objelean

unread,
Feb 13, 2014, 11:54:30 AM2/13/14
to wr...@googlegroups.com
Could you provide a sample input?
Also, have you tried using cssDataUri pre processor?

Alex


--
You received this message because you are subscribed to the Google Groups "wro4j" group.
To unsubscribe from this group and stop receiving emails from it, send an email to wro4j+un...@googlegroups.com.
To post to this group, send email to wr...@googlegroups.com.
Visit this group at http://groups.google.com/group/wro4j.
For more options, visit https://groups.google.com/groups/opt_out.

schou...@adaptik.com

unread,
Feb 17, 2014, 9:33:25 AM2/17/14
to wr...@googlegroups.com
After debugging we found that, base64 image has "//" and less4j was considering rest of the image data as an comment. So it is not able to compile .less file.

@LOGO_TEST_DATA: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMAAAABE//CAYAAADX/TrJAAAAGXRFWHRTb2Z0d2F');

is there any solution to fix this issue? I will try using cssDataUri preprocessor today.

Thanks,
Santosh C.

schou...@adaptik.com

unread,
Feb 17, 2014, 4:40:05 PM2/17/14
to wr...@googlegroups.com, schou...@adaptik.com
I tried using cssDataUri, I tried using fallbackCssDataUri too. Unfortunately didnt worked.

eg less file def which is causing issue:
@LOGO_TEST_DATA: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMAAAABE//CAYAAADX/TrJAAAAGXRFWHRTb2Z0d2F');

Can you help me to find out which of the pre/post processor is responsible to remove the comment lines from less files?

preProcessors=cssUrlRewriting,fallbackCssDataUri,cssImport,semicolonAppender
postProcessors=cssVariables,less4j,jsMin

Any suggestions?

Thanks,
Santosh C.

Alex Objelean

unread,
Feb 18, 2014, 7:27:50 AM2/18/14
to wr...@googlegroups.com
I have tested the following less input:
@LOGO_TEST_DATA:    url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMAAAABE//CAYAAADX/TrJAAAAGXRFWHRTb2Z0d2F');
#test {
background: @LOGO_TEST_DATA
}
with two versions of wro4j: 1.7.2 and 1.7.3. Both of them produce valid output:

#test {
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMAAAABE//CAYAAADX/TrJAAAAGXRFWHRTb2Z0d2F');
}
I will add a quick test which uses the same processors as in your case, to be sure that it is not something else causing the problem. 
What version are you using?

Alex

Alex Objelean

unread,
Feb 18, 2014, 7:37:42 AM2/18/14
to wr...@googlegroups.com
I've managed to reproduce the issue only with wro4j-1.6.3, which uses older version of less4j. 
The solution is either upgrade wro4j version (and it will use transitively newer version of less4j) or update the less4j dependency version only to a newer version.

Cheers,
Alex


On 17 February 2014 23:40, <schou...@adaptik.com> wrote:
Reply all
Reply to author
Forward
0 new messages