Grunt不会更新主scss文件

Question

我有一个项目使用GruntJS与grunt-contrib-sass,grunt-contrib-watch和grunt-newer.

我的主要app.scss文件使用@import指令导入一些.scss文件

@import"common/vars.scss";

如果我在主app.scss中进行更改,一切正常.问题是,当我对正在导入的文件(如vars.scss)进行更改时,app.scss不会更新.

这是我的观察任务:

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

这是sass的任务本身:

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';
          }
        }]
      }
    }

知道如何更改Gruntfile.js以涵盖这个场景吗？:) 谢谢.

Answer 1

我认为您的手表tasks变量是向后的，您可以通过打开终端进行检查，转到您通常运行的目录grunt watch，但newer:sass如果不起作用，请尝试运行，尝试sass:newer稍后的工作是否会更改手表设置中的该行。

另外，如果你只有一项 sass 任务，你可以将其更改为：

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

顺便说一句，你的 sass 似乎有不必要的复杂重命名功能，如果你只是想将scss/**/*.scss它们变成style/**/*.css你应该能够使用它（取自 grunt-contrib-sass 自述文件）：

grunt.initConfig({
  sass: {
    dist: {
      files: [{
        expand: true,
        cwd: 'scss',
        src: ['**/*.scss'],
        dest: 'styles',
        ext: '.css'
      }]
    }
  }
});

如果您有使用多个点的文件，例如：file.src.scss添加extDot: 'last'到文件数组