Grunt: Why is concat and uglify not working when the watch task sees a file change?

Question

Grunt doesn't concat and uglify my javascript files when these files are changed and changes are watched for.

If I run grunt concat the js files are concatenated as expected.

If I then run grunt uglify the files are uglified as expected.

However when I simply run grunt the watch task starts and I change a javascript file I get this:

$ grunt
Running "watch" task
Waiting...
>> File "src/js/test.js" changed.
Running "uglify:my_target" (uglify) task
>> Destination dest/js/app.min.js not written because src files were empty.
>> No files created.

Why does it work when I run individual commands but not when changes to the files are being watched for?

Here's my grunt file:

module.exports = function(grunt) {

// Project configuration.
grunt.initConfig({
  pkg: grunt.file.readJSON('package.json'),

  concat: {
      options: {
        separator: ';',
      },
      dist: {
        src: ['src/**/*.js'],
        dest: 'dest/js/app.js',
      },
    },

  uglify: {
    my_target: {
        files: {
          'dest/js/app.min.js': ['<%= concat.dist.dest %>']
        }
    }
  },


  compass: {                  // Task 
    dist: {                   // Target 
      options: {              // Target options 
        sassDir: 'scss',
        cssDir: 'css',
        environment: 'production'
      }
    },
    dev: {                    // Another target 
      options: {
        sassDir: 'scss',
        cssDir: 'css'
      }
    }
  }, 

  watch: {
    css: {
      files: '**/*.scss',
      tasks: ['compass']
    },

    js:  { 
      files: 'src/js/*.js', tasks: [ 'uglify' ] 
    },
  }
});

grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-compass');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.registerTask('default',['watch', 'compass', 'concat', 'uglify']);
};

score 0 · Answer 1 · answered Sep 03 '15 at 13:09

I fixed this by changing the watch section. I also changed my_target to build.

My whole grunt file looks like this

module.exports = function(grunt) {

// Project configuration.
grunt.initConfig({
  pkg: grunt.file.readJSON('package.json'),

  concat: {
      options: {
        separator: "\n\n\n",
      },
      dist: {
        src: ['src/**/*.js'],
        dest: 'dest/js/app.js',
      },
    },

  uglify: {
    build: {
        files: {
          'dest/js/app.min.js': ['<%= concat.dist.dest %>']
        }
    }
  },


  compass: {                  // Task 
    dist: {                   // Target 
      options: {              // Target options 
        sassDir: 'scss',
        cssDir: 'css',
        environment: 'production'
      }
    },
    dev: {                    // Another target 
      options: {
        sassDir: 'scss',
        cssDir: 'css'
      }
    }
  }, 

  watch: {
    css: {
      files: '**/*.scss',
      tasks: ['compass']
    },

    scripts: {
        files: ['<%= concat.dist.dest %>'],
        tasks: ['concat', 'uglify:build'],
        options: {
          atBegin: true,
      }
    }
  }
});

grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-compass');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.registerTask('default',['watch', 'compass', 'concat', 'uglify']);

};

Grunt: Why is concat and uglify not working when the watch task sees a file change?

1 Answers1