Best or simplest way to integrate less in yeoman?

Question

I'm experimenting with yeoman.

I want to integrate less into my yeoman or grunt build. But I haven't found I simple way to do it.

I do have found to yeoman-less repository which refers to grunt-contrib-less. But that plugin is quite hard to plugin if you are new to yeoman and grunt. Isn't there a much easier way to plugin less into my yeoman webapp so the less commands are automatically added to the grunt build file?

Thanks for the tips and tricks!

Answer 1

Assuming that you scaffold out a new app using yo webapp and answer both questions with No, your best choice for integrating LESS is grunt-recess which you need to install first:

npm install --save-dev grunt-recess

If you dislike the linting rules, you can customize them. Feel free to uninstall grunt-compass and remove it from the package.json.

You then need to replace the compass task in the Gruntfile with this:

    recess: {
        options: {
            compile: true
        },
        dist: {
            files: [{
                expand: true,
                cwd: '<%= yeoman.app %>/styles',
                src: '{,*/}*.less',
                dest: '.tmp/styles/',
                ext: '.css'
            }]
        }
    }

You then need to replace all remaining references to the compass task with recess, so that the resulting Gruntfile looks like this one.

Answer 2

This is an old question, but I keep finding it. So, here is an up-to-date answer:

Use the "LessApp" generator for Yeoman, found here: https://github.com/robinpokorny/generator-lessapp