Create multiple grunt task

Question

watch: {
    css: {
        files: 'source/styles/**/*.scss',
        tasks: ['sass', 'autoprefixer', 'cssmin', 'clean:css'],
        options: {
            spawn: false,
        },
    },
    images: {
        files: 'source/assets/images/**/*.{png,jpg,gif}',
        tasks: ['clean:image', 'imagemin'],
        options: {
            spawn: false,
        },
    }
}



grunt.registerTask('css', [
    'sass',
    'cssmin',
    'clean:css'
]);



sass: {
    dist: {
        files: [{
            expand: true,
            src: ['source/styles/**/*.scss'],
            dest: 'build/styles/',
            ext: '.css',
            flatten: true
        }]
    },
    options: {
        compass: true,
        sourcemap: false
    }
}


grunt.registerTask('default', [
    'sass',
    'cssmin',
    'clean:css',
    'requirejs',
    'clean:js',
]);

I want to create a new gurnt task. Currenly, In my project, grunt css is working fine to build the complate packae SCSS. I need to create a new task like grunt home , which will build a specific folder SCSS.

How can I create grunt home ?

Answer 1

I think this should work, but i didn't test it (it will compile SCSS files from source/styles/SCSS to css in build/styles/css):

homeSass: {
    dist: {
        files: [{
            expand: true,
            src: ['source/styles/SCSS/**/*.scss'],
            dest: 'build/styles/css/',
            ext: '.css',
            flatten: true
        }]
    },
    options: {
        compass: true,
        sourcemap: false
    }
}

grunt.registerTask('homebuild', [
    'homeSass'
]);

Is it your are looking for? Or I misunderstand you?

Answer 2

so something like this you can create multiple tasks

sass2: {
    dist: {
        files: [{
            expand: true,
            src: ['source/styles/**/*.scss'],//path to different source file
            dest: 'build/styles/',//path to different destination for home
            ext: '.css',
            flatten: true
        }]
    },
    options: {
        compass: true,
        sourcemap: false
    }
}

grunt.registerTask('home', [
    'sass2'
]);

Now to run this you have 2 ways

1) simply say grunt home this will only run sass compilation specific to sass2

2) now if you wants to run both the tasks grunt css and grunt home in 1 go then do this

sass: {
    dist: {
        files: [{
            expand: true,
            src: ['source/styles/**/src1.scss', 'source/styles/**/src2.scss'],
            dest: 'build/styles/',
            ext: '.css',
            flatten: true
        }]
    },
    options: {
        compass: true,
        sourcemap: false
    }
}

grunt.registerTask('home', [
    'sass'
]);