带LiveReload的表不工作

Question

我不能让LiveReload和Grunt一起工作。我用的是咕噜-表。当Grunt正在监视指定的文件时，浏览器中没有重新加载任何内容。所以我会看看：

Running "watch" task
Completed in 0.203s at Thu Nov 21 2013 00:59:59 GMT-0500 (EST) - Waiting...
OK
>> File "views/index.html" changed.

但是浏览器窗口不更新。我使用的是LiveReload 2.0.9。对如何让它运行有什么建议吗？

Gruntfile.js

module.exports = function(grunt) {

  'use strict';

  grunt.initConfig({
    express: {
      dev: {
        options: {
          script: './app.js'
        }
      }
    },
    watch: {
      tasks:  [ 'express:dev' ],
      options: {
        livereload: true,
        nospawn: true
      },
      files: [
        './views/index.html',
        './preprocessing/css/style.scss'
      ]
    }
  });

  grunt.loadNpmTasks('grunt-express-server');
  grunt.loadNpmTasks('grunt-contrib-watch');

  grunt.registerTask('default', [ 'express:dev', 'watch' ]);
};

Answer 1

默认情况下，您所缺少的只是在文档中包括livereload脚本：<script src="//localhost:35729/livereload.js"></script>。

如果您希望避免手动执行此操作，则可以使用肝连接中间件。

Gruntfile.js，这是使用我链接到的中间件进行监视和肝读取的设置。

Answer 2

如果不将livereload.js添加到pages.You中，可以使用chrome插件：

https://chrome.google.com/webstore/detail/livereload/jnihajbhpnppcggbcgedagnkighmdlei。

使用此插件.when页面加载，单击插件ico，确保点changed.Then页面源将自动添加

Answer 3

您可以使用Grunt 实时发布浏览器页面

GitHub

​

​

样例

const 
  LiveReload = require("live-reload-bp");
  // webServer = require('./web-server');

var 
  liveReload;

// webServer();

module.exports = function(grunt) {

  grunt.initConfig({
  
    liveReload: {
      run: {
        options: {
          host: '127.0.0.1',
          port: '8080'
        }
      },    
      js: {
        options: {}
      },
    },

    uglify: {
        build777: {
          files: [{
            expand: true,
            cwd: 'src',
            src: 'js/**/*.js',
            dest: 'dest'
          }]
        }
    },

    watch: {
      options: {
        spawn: false 
        // It is recommended to disable `false` or not use 'grunt-contrib-watch' 
        // or perhaps even Grunt. Because it works very very slowly.
      },
      js: {
          files: ['src/**/*.js'],
          tasks: ['uglify', 'liveReload:js']
      },       
    },

  });


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


  // Register Task
  grunt.registerTask('start', ['liveReload:run', 'watch']);


  grunt.registerMultiTask('liveReload', '', function() {
      if (grunt.fail.errorcount > 0 || grunt.fail.warncount > 0) {
          return false;
      }

      if(this.target === 'run'){
          liveReload = new LiveReload(this.data.options);
          liveReload.run();
      }else{
          liveReload.reloadPage();
      }
  });

}