LiveReload和Grunt?

时间:2014-01-06 23:10:37

标签: javascript gruntjs livereload grunt-contrib-watch

除了this answer之外,我还以watch github page为出发点进行了咨询。

我的观察任务如下:

watch: {
  less: {
    files: ['less/**/*.less'],
    tasks: ['less'],
    options: {
      livereload: true
    }
  },
  handlebars: {
    files: ['templates/**/*.hbs'],
    tasks: ['handlebars'],
    options: {
      livereload: true
    }
  }
}

首先我尝试使用浏览器扩展,然后我在index.html中添加了这个脚本(并验证它已加载)

<script src="//localhost:35729/livereload.js"></script>

我也尝试将其添加到我的手表js:

livereload: {
  files: ['dev/**/*'],
  options: {
    livereload: true
  }
}

我还有一个连接任务,我尝试使用或不使用grunt无效。

connect: {
  dev: {
    options: {
      port: 35729
    }
  }
}

仍然没有现场重装...

3 个答案:

答案 0 :(得分:1)

这是我的Gruntfile.js,我的连接版本是0.9.0,此配置可以用于不同的livereroad端口

module.exports = function (grunt) {

require('load-grunt-tasks')(grunt);
require('time-grunt')(grunt);
grunt.initConfig({
    watch: {
        demo: {
            files: ['web/*.*'],
            options: {
                livereload: 5000
            }
        },
        dev:{
            files: ['web1/*.*'],
            options: {
                livereload: 3030
            }
        }
    },
    connect: {
        demo: {
            options: {
                base: "web",
                port: 1111,
                hostname: '*',
                livereload: 5000,
                open: {
                    target: 'http://127.0.0.1:1111'
                }
            }
        },
        dev:{
            options: {
                base: "web1",
                port: 2222,
                hostname: '*',
                livereload: 3030,
                open: {
                    target: 'http://127.0.0.1:2222'
                }
            }
        }
    }
})
grunt.registerTask('demo', ['connect:demo', 'watch:demo']);
grunt.registerTask('dev',['connect:dev','watch:dev']);

}

答案 1 :(得分:0)

这有用吗?

watch: {
  options: { livereload: true },
  less: {
    files: ['less/**/*.less'],
    tasks: ['less']
  },
  //...
}

还尝试以详细模式(grunt do-something -v)运行以检查livereload服务器是否启动以及端口是否正确。

答案 2 :(得分:0)

Watch开箱即用,没有实时加载。您是否尝试删除livereload选项并且脚本包括?

然后:咕噜咕噜咕噜咕噜的手表

(默认任务执行构建,然后监视注意更改)