Question

我使用grunt-contrib-watch任务（v.5.3）来启用LiveReload：

        livereload: {
            options: {
               middleware: function (connect) {
                           return [lrSnippet, mountFolder(connect, '.tmp'), 
                           mountFolder(connect, 'src'),
                           proxySnippet];
               }
            }
        }

    //...some other tasks...


        watch: {
                    livereload: {
                        options: {
                            livereload: LIVERELOAD_PORT
                        },
                        files: [
                            'src/*.html'
                        ]
                    }
               }

//...................................

grunt.registerTask('server', [
        'clean:server',
        'recess:compile',
        'configureProxies',
        'connect:livereload',
        'open',
        'watch'
    ]);

在运行grunt server --verbose（包括watch任务）时，我最终得到了这个控制台输出：

Running "watch" task
    Waiting...Verifying property watch exists in config...OK
    Verifying property watch.livereload.files exists in config...OK
    Live reload server started on port: 35729
    Watching src/404.html for changes.
    Watching src/app for changes.
    Watching src/assets for changes.
    Watching src/common for changes.
    Watching src/less for changes.
    Watching src/vendor for changes.
    Watching src/index.html for changes.

例如，我们在这里看到src/index.html被观察到，因此我尝试更改页面标题以查看实时修改。但是，一旦我保存文件，进程退出..

我读到了如果提供的文件路径无效，watch任务可能会退出的事实。但是，Watching src/index.html for changes断言它存在，不是吗？

我不明白。

Answer 1

所以问题是...... bug与NodeJs 0.10.18。

我更新到0.10.21并且整个工作没有改变我的第一个要点。

总之，如果您有OSX 10.9（Mavericks），则必须将Node更新为0.10.21

Answer 2

不确定这是否是您遇到的问题，但似乎您直接使用connect-livereload中间件而不是直接设置livereload选项，如grunt-contrib-connect所支持。

这是一个简单的例子GruntFile，只使用grunt-contrib-watch和grunt-contrib-connect：

module.exports = function (grunt) {
  var LIVERELOAD_PORT = 12345;

  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    connect: {
      server: {
        options: {
          port: 9001,
          base: './src',
          livereload: LIVERELOAD_PORT
        }
      }
    },
    watch: {
      develop: {
        files: 'src/*.html',
        options: {
          livereload: {
            port: LIVERELOAD_PORT
          }
        }
      }
    }

  });

  grunt.loadNpmTasks('grunt-contrib-connect');
  grunt.loadNpmTasks('grunt-contrib-watch');

  grunt.registerTask('server', [
    'connect:server',
    'watch'
  ]);
};

如果您不需要配置特定端口并且可以使用默认端口，那么它甚至更简单 - 只需将两个任务的livereload属性更改为true：

livereload: true

grunt-contrib-watch默默地退出

2 个答案: