'watch‘命令不起作用

Question

当我在终端中运行grunt watch任务时，当我修改文件时，它似乎没有获得任何更改。

我不确定是我的文件结构还是我Gruntfile.js中的配置。谁能让我知道我做错了什么？

   sass: {
        dist: {
            options: {
                style: 'compressed',
                require: 'susy'
            },
            files: {
                'app/styles/css/main.css': 'app/styles/sass/main.scss'
            }
        }
    },

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

    },
     watch: {

        css: {
            files: 'app/styles/sass/*.scss',
            tasks: ['sass'],
            options: {
                livereload: true,
            },
        }

    }

});


grunt.loadNpmTasks('grunt-contrib-sass');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-autoprefixer');
grunt.loadNpmTasks('grunt-contrib-cssmin');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-sprite-generator');
grunt.registerTask('watchfiles', ['sass',  'watch' ]);

​

​

Answer 1

假设您希望watch监听ATomes子目录中.scss文件的更改，那么在watch css任务配置中将files: 'app/styles/sass/*.scss'更改为files: 'app/styles/sass/**/*.scss'

现在，您只能查看扩展名为.scss的文件，这些文件也是sass目录的直接子目录。添加两个星号后，**/*.scss会告诉grunt contrib- watch，您想要递归地查看sass dirs子目录中所有带有扩展.scss的文件。

在我看来，你问题下面的注释中关于创建一个名为watchfiles的任务的建议不是一个好的建议。这个建议是为了促进过于通用的任务命名，并且不能描述任务所做的事情，并创建一个完全不必要的附加层。

在测试此方法是否正常工作时，为了消除添加不确定性的任何其他层，可以通过在与Gruntfile.js相同的目录中运行命令grunt watch:css来直接调用watch:css任务，进行更改并观察结果。