Grunt-autoprefixer endlessly when using grunt-contrib-watch

Question

I am just learning Grunt . I am going to use a compass to generate vertical rhythm and image, as well as autoprefixer to prefix css3 styles.

Here is my Gruntfile.js .

module.exports = function(grunt) { var globalConfig = { sassDir: 'sass', cssDir: 'css' }; require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks); // Project configuration. grunt.initConfig({ globalConfig: globalConfig, pkg: grunt.file.readJSON('package.json'), compass: { dev: { options: { sassDir: '<%= globalConfig.sassDir %>', cssDir: '<%= globalConfig.cssDir %>' } } }, autoprefixer: { dev: { options: { browsers: ['last 2 versions'] }, src: '<%= globalConfig.cssDir %>/style.css', dest: '<%= globalConfig.cssDir %>/style.css' } }, watch: { compass: { files: ['<%= globalConfig.sassDir %>/**/*.scss'], tasks: ['compass:dev'], }, autoprefixer: { files: ['<%= globalConfig.cssDir %>/style.css'], tasks: ['autoprefixer:dev'] }, livereload: { options: { livereload: true }, files: ['<%= globalConfig.cssDir %>/style.css'] } } }); // Default task(s) that will be run by invoking 'grunt' w/o args grunt.registerTask('styles:dev', ['compass', 'autoprefixer']); grunt.registerTask('default', ['styles:dev', 'watch']); }; 

But whenever I run

 grunt 

Everything works as expected, except that grunt-contrib-watch constantly calls grunt-autoprefixer.

I'm just starting to learn Grunt . This is probably the wrong configuration of my Gruntfile.js

Hope you could help me here.

Answer 1

Change your task configuration to:

 watch: { compass: { files: ['<%= globalConfig.sassDir %>/**/*.scss'], tasks: ['compass:dev', 'autoprefixer:dev'] }, livereload: { options: { livereload: true }, files: ['<%= globalConfig.cssDir %>/style.css'] } } 

Basically, grunt-contrib-watch will run tasks whenever the file is updated, and also because your source and destination files are the same, it turns it into an endless loop. Just run auto-detection as soon as your compass task builds your css. Hope this helps. :-)