Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Compile less files with grunt-contrib-less won't work

I'm using Grunt for building my web project. I installed grunt-contrib-less package und added a task to my grunt.initConfig({..});

less : {
            options: {
                paths: ['js/base']
            },
            files: {
                'js/base/*.css' : 'js/base/*.less'
            }
        }

when I run the target less via grunt less, it runs without errors but doesn't compile the less file to a css file.

Running "less:files" (less) task

Done, without errors.

I have installed the lessc package via node, too. Doing lessc <source> <dest> works fine.

Currently I have pointed with the files option directly to one dir which contains one less file for testing. Even if I write the whole file name into files option, it happens nothing...

Later on I want to scan the whole js directory and compile all new modified *.less files.

I have installed following versions:

grunt-cli v0.1.6
grunt v0.4.0
node v0.8.7
npm 1.1.49

BR, mybecks

like image 919
mybecks Avatar asked Feb 26 '13 16:02

mybecks


2 Answers

The glob pattern js/base/*.css does not match any files, therefore there is no destination. Usually, tasks like this expect multiple inputs to combine into a single output. Also, bear in mind that less is a multi-task, and putting files as a child of less is not doing what you expect. (it is treating it as a target, not a src/dest map)

If you want a 1-1 transform of .less into .css, you can use dynamic expansion. (or you can define each src/dest pair manually, but who wants to do that?)

In your case:

less: {
    options: {
        paths: ['js/base']
    },
    // target name
    src: {
        // no need for files, the config below should work
        expand: true,
        cwd:    "js/base",
        src:    "*.less",
        ext:    ".css"
    }
}
like image 195
Dominic Barnes Avatar answered Oct 22 '22 13:10

Dominic Barnes


I used Anthonies solution but stil had an error

Warning: Object true has no method indexOf

If I changed the order putting expand true as second it gave me the error

Unable to read "less" file

where "less" was the value of the first item in my list.

I solved it by changing files into an array like this:

less: {
    options: {

            paths: ["js/base"]
        },
        files: [{
            expand: true,
            cwd: "js/base",
            src: ["**/*.less"],
            dest: "js/base",
            ext: ".css"
        }]
},

I used "grunt-contrib-less" : "^0.11.0"

like image 44
Michiel Avatar answered Oct 22 '22 13:10

Michiel