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