I have csscomb running fine, and it triggers with watch, but is there a way to only have csscomb run against the scss file i'm working on, rather than all of them within my project?
Here's my Gruntgile.js. The csscomb set up is odd since i have my sass files in two root folders.
module.exports = function (grunt) {
'use strict';
// load grunts tasks automatically
require('load-grunt-tasks')(grunt);
grunt.initConfig({
pkg: this.file.readJSON('package.json'),
info: {
sourceDir: '.',
stylesDir: '<%= info.sourceDir %>/styles',
images: '<%= info.sourceDir %>/images',
fonts: '<%= info.sourceDir %>/fonts',
scripts: '<%= info.uiDir %>/scripts',
svgDir: '<%= info.sourceDir %>/svg',
configFiles: '<%= info.sourceDir%>/configFiles',
sourceSass: '<%= info.src %>/<%= info.stylesDir %>',
sourceImages: '<%= info.sourceDir%>/<%= info.images %>',
sourceScripts: '<%= info.sourceDir%>/<%= info.scripts %>',
sourceSVG: '<%= info.sourceDir%>/<%= info.svgDir %>',
bowerDir: '<%= info.ui %>/bower_components'
},
clean: {
options: {
force: true
},
css: [
'<%= info.sourceDir %>/*.css'
],
js: [
'<%= info.sourceDir %>/*.js',
'<%= info.sourceDir %>/scripts/main.min.js'
],
icons: [
'<%= info.sourceDir %>/icons/'
]
},
grunticon: {
all: {
options: {
enhanceSVG: true
},
files: [{
expand: true,
cwd: '<%= info.sourceSVG %>',
src: ['*.svg', '*.png'],
dest: "<%= info.ui %>/icons"
}],
}
},
compass: {
options: {
config: '<%= info.configFiles %>/config.rb'
},
dev: {
options: {
sourcemap: true,
environment: 'development',
outputStyle: 'expanded'
}
},
prod: {
options: {
environment: 'production',
noLineComments: true,
outputStyle: 'compressed'
}
}
},
csscomb: {
options:{
config: '<%= info.configFiles %>/.csscomb.json'
},
components:{
expand: true,
cwd: './components/',
src: ['**/*.scss'],
dest: './components/'
},
styles: {
expand: true,
cwd: '<%= info.stylesDir %>',
src: ['**/*.scss'],
dest: '<%= info.stylesDir %>'
}
},
uglify: {
dev: {
options: {
sourceMap: true,
sourceMapName: 'sourceMap.map',
mangle: false,
beautify: true,
preserveComments: 'all',
quoteStyle: 3
},
src: [
'bower_components/foundation/js/vendor/fastclick.js',
'bower_components/foundation/js/foundation.min.js',
'scripts/global.js',
'components/**/*.js'
],
dest: 'scripts/main.min.js'
},
prod: {
}
},
jshint: {
options: {
force: true,
jshintrc: '<%= info.configFiles %>/.jshintrc'
},
all: [
'<%= info.sourceDir %>/components/**/*.js',
'<%= info.sourceDir %>/scripts/**/*.js',
'!<%= info.sourceDir %>/scripts/modernizr*.js',
'!<%= info.sourceDir %>/scripts/main.min.js'
]
},
jsbeautifier: {
options: {
config: '<%= info.configFiles %>/.jsbeautifyrc'
},
all: {
src: [
'<%= info.sourceDir %>/components/**/*.js'
]
}
},
watch: {
sass: {
files: [
'styles/**/*.scss',
'components/**/*.scss'
],
tasks: ['css']
},
js: {
files: [
'<%= info.sourceDir %>/components/**/*.js',
'!<%= info.sourceDir %>/scripts/**/*.js'
],
tasks: ['js']
}
}
});
grunt.registerTask('css', [
'csscomb',
'compass:dev'
]);
grunt.registerTask('js', [
'jsbeautifier:all',
'jshint:all',
'uglify:dev'
]);
grunt.registerTask('jsDev', [
'uglify:dev'
]);
grunt.registerTask('src', [
'grunticon',
'css',
'js'
]);
grunt.registerTask('dev', [
'clean:css',
'clean:icons',
'src',
'watch'
]);
};
Use grunt-newer
https://github.com/tschaub/grunt-newer
Then change your css
task to
grunt.registerTask('css', [
'newer:csscomb',
'compass:dev'
]);