sinrise sinrise - 1 month ago 15
Javascript Question

Uglify not working with Grunt Watch

I have a pretty basic setup with sass, watch and uglify but for some reason I can't get watch to detect when a js file is saved. It works fine for SCSS/CSS (compiles and reloads.) If I run 'grunt uglify' it bundles my JS files, and if watch is running (in another console instance) it will detect it and trigger the reload.

I've tried lots of combinations and I have a feeling it's something really dumb I'm doing/not doing but I'm just not seeing it.

my gruntfile.js:

module.exports = function(grunt) {
grunt.registerTask('default', ['sass', 'uglify']);
grunt.initConfig({
sass: {
dist: {
options: {
style: 'expanded'
},
files: { 'fivesixtwo.com/src/FiveSixTwo.com/wwwroot/css/main.css': 'fivesixtwo.com/src/FiveSixTwo.com/wwwroot/css/main.scss' }
}
},
uglify: {
my_target: {
files: {
'fivesixtwo.com/src/FiveSixTwo.com/wwwroot/js/site.js': [
'fivesixtwo.com/src/FiveSixTwo.com/wwwroot/lib/jquery/dist/jquery.js',
'fivesixtwo.com/src/FiveSixTwo.com/wwwroot/lib/*.js'
]
}
}
},
watch: {
options: {
livereload: 35729,
},
html: {
files: ['fivesixtwo.com/src/FiveSixTwo.com/Views/*.cshtml'],
},
sass: {
options: {
livereload: false
},
files: ['fivesixtwo.com/src/FiveSixTwo.com/wwwroot/css/*.scss'],
tasks: ['sass']
},
css: {
files: ['fivesixtwo.com/src/FiveSixTwo.com/wwwroot/css/main.css'],
tasks: []
},
scripts: {
files: ['fivesixtwo.com/src/FiveSixTwo.com/wwwroot/js/site.js'],
tasks: ['uglify']
}
}
});

grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-sass');
grunt.loadNpmTasks('grunt-contrib-uglify');

};

Answer

Look at your watch config:

scripts: {
    files: ['fivesixtwo.com/src/FiveSixTwo.com/wwwroot/js/site.js'],
    tasks: ['uglify']
}

You are only watching for a single js files changes called site.js. To watch all your sources use this config:

scripts: {
    files: ['fivesixtwo.com/src/FiveSixTwo.com/wwwroot/lib/*.js'],
    tasks: ['uglify']
}

Use the same pattern as in the uglify config. I assumed you are not going to modify jquery itself.