Create NodeLessCssProcessor based on lessc binary

[GoogleCodeExporter]

Create a lessCss processor which would use lessc command line binary. 
The processor will work only if lessc binary is available and won't be cross 
platform by default.

Original issue reported on code.google.com by alex.obj...@gmail.com on 11 Sep 2012 at 8:51

[GoogleCodeExporter]

Fixed in branch 1.4.x

Original comment by alex.obj...@gmail.com on 14 Sep 2012 at 1:30

• Changed state: Fixed

[GoogleCodeExporter]

Issue 489 has been merged into this issue.

Original comment by alex.obj...@gmail.com on 15 Sep 2012 at 10:45

[GoogleCodeExporter]

Original comment by alex.obj...@gmail.com on 27 Sep 2012 at 12:25

• Added labels: Milestone-Release-1.5.0
• Removed labels: Milestone-Release-1.4.10

[GoogleCodeExporter]

Hi Alex. I was hoping the node based less processor would solve the @import 
issue however it just returns "FileError: 'file.less' wasn't found"

When I run the `lessc` binary on the file in question, it works correctly

Original comment by gnoodl on 3 Oct 2012 at 6:20

[GoogleCodeExporter]

Might have something to do with the path you pass to `lessc`. In debugging, it 
looks like an absolute path, eg `/path/to/file.less` where the "path" part is 
relative to `src/main/webapp`. Might be better to prefix that with a `.`, eg 
`./path/to/file.less`

Original comment by gnoodl on 3 Oct 2012 at 6:35

[GoogleCodeExporter]

The native less @import resolver won't work in all situations, simply because 
wro4j handles resources located in various locations (classpath, servlet 
context relative, absolute, etc), while lessc can resolve only some those 
located physically on disc. 
This is the reason why using of cssImportPreProcessor is important in order to 
make it work correctly. Another option is to use lessCss processor as a post 
processor.

Original comment by alex.obj...@gmail.com on 3 Oct 2012 at 6:46

[GoogleCodeExporter]

I'm talking about the node less processor that uses lessc. The command you 
execute is something like

    lessc --no-color /path/to/file..ess

I'm not sure how it works out the path correctly but there's no reason it 
shouldn't be able to handle @import statements for files in the same directory

Original comment by gnoodl on 3 Oct 2012 at 11:50

[GoogleCodeExporter]

First of all, I would like to understand why using cssImportPreProcessor is a 
problem for you...
Regarding how the NodeLessCssProcessor works with lessc. That is correct that 
it uses lessc --no-color /path/to/file..less . To be more precise it uses: 
lessc --no-color /tmp/wro4j-<UNIQUE_GUID>.css, where the file used by lessc is 
located in temporary folder with unique generated name  (in order to avoid 
accidental name clashing, especially when processor is running in parallel) 
with content copied from its original location. In order to make it possible 
lessc to resolve @import directives, the imported files should be located in 
the correct location relative to that temporary file.

Theoretically it is possible to create temporary file for each @import found in 
processed less resource. In order to invest time and effort in achieving that, 
I would like to understand the problem you have with the alternative approach.

Original comment by alex.obj...@gmail.com on 4 Oct 2012 at 7:06

[GoogleCodeExporter]

The cssImport pre-processor does not work correctly for less files (at least 
with the fallback Rhino less processor). For example, say I have a file 
`src/main/webapp/less/mixins.less` with

    .border-radius(@br) {
        -webkit-border-radius: @br;
           -moz-border-radius: @br;
                border-radius: @br;
    }

and another file `src/main/webapp/less/stylesheet.less`

    @import "mixins.less";

    .some-class {
        .border-radius(5px);
    }

My wro model is

    <group name="demo">
        <css>/less/stylesheet.less</css>
    </group>

and in wro.properties

    preProcessors=cssImport,lessCss.less,semicolonAppender

When attempting to build this, I get

    [INFO] processing group: demo.css
    4767 ERROR RhinoScriptBuilder   - JavaScriptException occured: Could not execute the script because: 
    {
      "type": "Name",
      "message": ".border-radius is undefined",
      "filename": null,
      "extract": [
        "            .border-radius(5px);",
      ]
    }

Original comment by gnoodl on 8 Oct 2012 at 12:35

[GoogleCodeExporter]

[deleted comment]

[GoogleCodeExporter]

[deleted comment]

[GoogleCodeExporter]

The error for the Node version is

[INFO] processing group: demo.css
0    ERROR NodeLessCssProcessor - exitStatus: 2
2    WARN NodeLessCssProcessor - Exception while applying NodeLessCssProcessor 
processor on the /less/stylesheet.less resource, no processing applied...
ro.isdc.wro.WroRuntimeException: Error in LESS: 
NameError: .border-radius is undefined in /less/stylesheet.less

Original comment by gnoodl on 8 Oct 2012 at 12:47

[GoogleCodeExporter]

Created new issue for reported problem: 
http://code.google.com/p/wro4j/issues/detail?id=576

You can track its progress or add your comments there.

Original comment by alex.obj...@gmail.com on 8 Oct 2012 at 9:49