Ich habe ein Projekt, das GruntJS mit grunt-contrib-sass, grunt-contrib-watch und grunt-newer verwendet.

Meine Hauptdatei app.scss importiert ein paar .scss-Dateien mit der Direktive @import wie

@import "common / vars.scss";

Wenn ich Änderungen in der Haupt-app.scss vornehme, funktioniert alles. Das Problem ist, dass wenn ich Änderungen an einer Datei vornehme, die importiert wird (wie vars.scss), die app.scss nicht aktualisiert wird.

Das ist meine Watch-Aufgabe:

    watch: {
      css: {
        files: ['scss/**/*.scss'],
        tasks: ['newer:sass'],
        options: {
          spawn: false,
        }
      }
    }

Und das ist die Sass-Aufgabe selbst:

sass: {
      dist: {
        options: {
          style: 'compressed',
          noCache: true
        },
        /* looks for every .scss file in the scss folder (checks nested folders too), 
         * compile it and create another file wit the same name in the style folder */
        files: [{
          expand: true,
          cwd: 'scss',
          src: ['**/*.scss'],
          dest: 'style',
          rename: function (dest, src) {
            var folder    = src.substring(0, src.lastIndexOf('/'));
            var filename  = src.substring(src.lastIndexOf('/'), src.length);

            filename  = filename.substring(0, filename.lastIndexOf('.'));

            return dest + '/' + folder + filename + '.css';
          }
        }]
      }
    }

Hast du eine Idee, wie du die Gruntfile.js ändern kannst, um auch dieses Szenario abzudecken? :) Vielen Dank.