Grunt watch: Not triggering any task

Question

I am trying to automate my workflow with the help of Grunt. I have everything set up, but the watch task is not working - I can start it, but it doesn't detect changes. The problem really must be in the watch task, as I can trigger the sass task by hand and it compiles correctly without problems.

My Gruntfile looks like this:

module.exports = function (grunt) {

    require('load-grunt-tasks')(grunt);

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

        sass: {
            dist: {
                options: {
                    'style': 'compressed'
                },
                expand: true,
                cwd: './sass/',
                src: 'style.scss',
                dest: './css/',
                ext: '.css'
            },
            dev: {
                options: {
                    'style': 'expanded',
                },
                expand: true,
                cwd: './sass/',
                src: 'style.scss',
                dest: './css/',
                ext: '.css'
            }
        },

        watch: {
            sass: {
                files: ['<%= sass.dev.src %>'],
                tasks: ['default']
            }
        }
    });

    grunt.registerTask('default', ['sass:dev']);
};

The structure in the project directory looks like this:

Gruntfile.js
index.html
package.json
css
  > style.css (created by sass task)
node_modules
  > all required modules
sass
  > style.scss

To me everything looks good, but as it is not working something must be wrong. My guess it that the paths following the 'expand' option are off, although I already tried other structures that didn't work either.

Answer 1

Because sass.dev.src equals src: 'style.scss'. The watch task configured with files: ['<%= sass.dev.src %>'] will try and watch ./style.scss and not ./sass/style.scss.

The watch task has a cwd option (options:{cwd:'./sass'}) but probably easier to just set it to watch files: ['sass/*.scss'] instead.