Grunt Watch:每次SASS错误后需要保存两次

Grunt Watch:每次SASS错误后需要保存两次,sass,gruntjs,grunt-contrib-watch,Sass,Gruntjs,Grunt Contrib Watch,在编辑我的SASS文件时使用grunt watch时,如果出现SASS错误,我必须在更正错误后保存两次才能解决。以下是事件的顺序: 我在SASS文件中包含一个不存在的mixin并保存 grunt watch抛出SASS错误 我修复错误并保存 grunt watch抛出相同的错误 我又存钱了 grunt watch编译正确 这是我的grunfile.js: module.exports = function(grunt) { // Configuration grunt.init

在编辑我的SASS文件时使用
grunt watch
时,如果出现SASS错误,我必须在更正错误后保存两次才能解决。以下是事件的顺序:

  • 我在SASS文件中包含一个不存在的mixin并保存
  • grunt watch
    抛出SASS错误
  • 我修复错误并保存
  • grunt watch
    抛出相同的错误
  • 我又存钱了
  • grunt watch
    编译正确
  • 这是我的
    grunfile.js

    module.exports = function(grunt) {
    
        // Configuration
        grunt.initConfig({
            pkg: grunt.file.readJSON('package.json'),
    
            imagemin: {
                dynamic: {
                    files: [{
                        expand: true,
                        cwd: 'assets/img',
                        src: ['assets/img/**/*.{png,jpg,gif}'],
                        dest: 'assets/img'
                    }]
                }
            },
            sass: {
                dist: {
                  options: {
                    loadPath: require('node-neat').includePaths,
                    style: 'compact',
                    lineNumbers: true,
                    cacheLocation: 'assets/sass/.sass-cache'
                  },
                  files: [{
                    expand: true,
                    cwd: 'assets/sass',
                    src: ['*.scss'],
                    dest: 'assets/css',
                    ext: '.css'
                  }]
                }
              },
            watch: {
                options: {
                    livereload: true
                },
                css: {
                    files: ['assets/sass/**/*.scss'],
                    tasks: ['newer:sass'],
                    options: {
                        spawn: false
                    }
                },
                images: {
                    files: ['assets/img/**/*.{png,jpg,gif}'],
                    tasks: ['imagemin'],
                    options: {
                        spawn: false
                    }
                },
                js: {
                    files: ['assets/js/**/*.js'],
                    options: {
                        spawn: false
                    }
                },
                html: {
                    files: ['*.html'],
                    options: {
                        spawn: false
                    }
                },
                php: {
                    files:['**/*.php'],
                    options: {
                        spawn: false
                    }
                }
            }
    
        });
    
        // List plugins we're using
        grunt.loadNpmTasks('grunt-contrib-watch'); // Watch - http://goo.gl/yxNE0
        grunt.loadNpmTasks('grunt-contrib-imagemin'); // Image Minify - http://goo.gl/mkIRPE
        grunt.loadNpmTasks('grunt-contrib-sass'); // SASS - http://goo.gl/pCHySn
        grunt.loadNpmTasks('grunt-newer'); // Newer - https://goo.gl/3vBTnf
    
        // Plugins to run when we run the 'grunt' command
        grunt.registerTask('default', [
            'imagemin',
            'sass'
        ]);
    
    };
    

    对于这个特定实例,Watch中神秘的
    spawn
    选项实际上需要设置为
    true
    。像大多数人一样,我真的不知道
    spawn
    是如何工作的,但它解决了这个问题

        watch: {
            css: {
                files: ['assets/sass/**/*.scss'],
                tasks: ['newer:sass'],
                options: {
                    spawn: true
                }
            }
        }
    
    您不必显式地将该选项设置为
    true
    ,它是默认设置的,因此您根本无法添加它。我只是在这里举个例子