LESS中的更改应触发整页重新加载

Question

我有一个grunt-watch任务，当它检测到文件更改时触发livereload。但是，当我更改.less文件时，它不会触发页面重新加载。在那种情况下，它只会使页面重新加载app.less更新样式。这似乎是有意的，但对于我的项目，在那个场合还有一个完整的页面重新加载会更实际。我可以强制grunt-watch始终执行整页重新加载吗？ BR， 丹尼尔

Answer 1

您可以使用grunt-touch触发html文件的更改：

module.exports = function(grunt) {
grunt.initConfig({
   less: {
                 development: {
                     files: {"index.css": "test.less"}
                 }
  },
  touch: {
    options: {
      force: true,
      mtime: true
    },
    src: ['index.html'],
  },
  watch: {
    less: {
      files: ['*.less'],
      tasks: ["less","touch"],
    },
    livereload: {
      options: { livereload: true },
      files: ['index.html'],
    },
  },
}
);
grunt.loadNpmTasks('grunt-contrib-less');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-touch');
grunt.registerTask( 'default', ["less","watch"] );
};