Grunt Sass - Compile all Sass files into CSS with the same name

Question

I used Compass and it compiles all Sass files into CSS with the same name. For example my-style.scss will become my-style.css.

All tutorials about grunt-sass that I found mapped the file name one by one, manually like:

sass: {
  dist: {
    options: { style: 'compressed' },
    files: { 'css/my-style.css': 'sass/my-style.scss' }
  } 
}

Is there a way to make it more flexible? So I don't need to change the Gruntfile whenever I have new Sass file.

Thanks

Answer 1

Try this format for specifying your source and destination files:

    sass: {
        src: {
            files: [{
                expand: true,
                cwd: 'source/styles/',
                src: ['**/*.scss'],
                dest: 'destination/styles/',
                ext: '.css'
            }]
        }
    }

This reads as "take all files matching *.scss in source/styles/ and its subfolders, process them and put them into destination/styles/, changing extension to .css. See also http://gruntjs.com/configuring-tasks#building-the-files-object-dynamically