Gruntfile for Drupal to compile Less to CSS with source maps

.jshintrc

{
  "node": true,
  "browser": true,
  "esnext": true,
  "bitwise": true,
  "camelcase": true,
  "curly": true,
  "eqeqeq": true,
  "immed": true,
  "indent": 4,
  "latedef": true,
  "newcap": true,
  "noarg": true,
  "quotmark": "single",
  "undef": true,
  "unused": true,
  "strict": true,
  "trailing": true,
  "smarttabs": true,
  "jquery": true
}

Gruntfile.js

'use strict';

module.exports = function(grunt) {

  var globalConfig = {
    cssBasename: 'style',
    themeDir: 'sites/all/themes/mysite',
    sourceMapRootpath: '/mysite/',
    cssFilename: '<%= globalConfig.themeDir %>/css/<%= globalConfig.cssBasename %>.css',
    lessFilename: '<%= globalConfig.themeDir %>/less/<%= globalConfig.cssBasename %>.less'
  };

  grunt.initConfig({
    globalConfig: globalConfig,
    less: {
      development: {
        options: {
          compress: true,
          yuicompress: true,
          optimization: 2,
          sourceMap: true,
          sourceMapFilename: '<%= globalConfig.cssFilename %>.map',
          sourceMapRootpath: '<%= globalConfig.sourceMapRootpath %>'
        },
        files: {
          // target.css file: source.less file
          '<%= globalConfig.cssFilename %>': '<%= globalConfig.lessFilename %>'
        }
      }
    },
    autoprefixer: {
      options: {
        map: {
          inline: false
        },
        src: '<%= globalConfig.cssFilename %>',
        dest: '<%= globalConfig.cssFilename %>'
      },
    },
    jshint: {
      options: {
        jshintrc: '.jshintrc'
      },
      all: ['Gruntfile.js', '<%= globalConfig.themeDir %>/js/**/scripts.js']
    },
    watch: {
      mains: {
        files: [ // which files to watch
          '<%= globalConfig.themeDir %>/less/**/*.less',
          '<%= globalConfig.themeDir %>/js/**/scripts.js',
          'Gruntfile.js'],
        tasks: ['jshint', 'less', 'autoprefixer'],
        options: {
          nospawn: true
        }
      }
    }
  });

  grunt.loadNpmTasks('grunt-autoprefixer');
  grunt.loadNpmTasks('grunt-contrib-jshint');
  grunt.loadNpmTasks('grunt-contrib-less');
  grunt.loadNpmTasks('grunt-contrib-watch');

  grunt.registerTask('default', ['jshint', 'less', 'autoprefixer', 'watch']);
};

package.json

{
  "devDependencies": {
    "grunt": "^0.4.5",
    "grunt-autoprefixer": "^1.0.1",
    "grunt-contrib-jshint": "^0.11.3",
    "grunt-contrib-less": "^0.11.4",
    "grunt-contrib-watch": "^0.6.1"
  }
}

Edit: Moved to https://github.com/hugovk/drupal-gruntfile

1. Place in the root directory.
2. Edit mysite in Gruntfile.js for your directory structure and change main.*if needed.
3. Get dependencies with npm install
4. Run grunt and leave running. It'll update CSS from Less at first run, and whenever the Less files or Gruntfile change. The CSS is minified,autoprefixed, and a CSS sourcemap is created for easier debugging. JS is also linted.