How to compile all .scss files to single .css file using grunt? Without using concat or import

Question

I want to compile all .scss files in my sass folder to a single .css file E:\SassToCss \sass \style1.scss \style2.scss \Want to have the compiled style.css in project root directory.

I tried the followings

sass: {
        dist: {
            files: {
                'style.css' : 'sass/*.scss'
            }
        }
    }

This is generating css for the first file only & ignoring rest of the files.

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

This not generating my .css file. What's the correct way of doing so

How does your directory structure looks like where .scss files are placed? — Vishwanath, May 27 '16 at 06:06

score 0 · Answer 1 · answered May 27 '16 at 10:55

Create a scss file, for example "style.scss" and use the @import tag for including other sass files.

Your sass compiler should take only style.scss to compile it in css

sass: {
        dist: {
            files: {
                'style.css' : 'sass/style.scss'
            }
        }
    }

See here for examples and better explanation: http://sass-lang.com/guide

How to compile all .scss files to single .css file using grunt? Without using concat or import

1 Answers1