I looked at the previous issues, but they seems to be referring to older version of the browsersync plugin. (Versions < 2.0)
The following is my Gruntfile. It was working fine before, then suddenly it stopped watching the css, although it's refreshes the browser for JS or PHP files.
module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
sass: {
options: {
sourceMap: true
},
dist: {
files: {
'../css/main.css' : '../sass/foundation.scss'
}
}
},
browserSync: {
dev: {
bsFiles: {
src : ['../css/main.css', '../js/*.js', '../*.php']
},
options: {
proxy: "test.testsite.com",
watchTask: true,
}
}
},
watch: {
css: {
files: ['../sass/*.scss', '../sass/responsive/*.scss'],
tasks: ['sass']
}
}
});
grunt.loadNpmTasks('grunt-sass');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-browser-sync');
grunt.registerTask('default',['browserSync', 'watch']);
}
Output on the grunt when there's a change made in scss file:
Done, without errors.
Completed in 0.789s at Tue Dec 01 2015 14:56:57 GMT-0500 (Eastern Standard Time) - Waiting...
[BS] File changed: C:\xampp\htdocs\vortex\wp-content\themes\vortex\css\main.css
There was nothing wrong with the Gruntfile. I figured, it was the prefixfree js plugin I included on the site, which conflicted with the injection. Once removed that, it worked fine.