web-dev-qa-db-ja.com

grunt-contrib-LiveReloadが機能しないウォッチ

LiveReloadをGruntで動作させることができません。 grunt-contrib-watchを使用しています。 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.

ただし、ブラウザウィンドウは更新されません。 LiveReload2.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' ]);
};
javascriptgruntjs
13
Evan Emolo

不足しているのは ドキュメントにlivereloadスクリプトを含む ：<script src="//localhost:35729/livereload.js"></script>デフォルトで。

これを手動で行う必要がない場合は、 connect-livereload ミドルウェアを使用できます。

これがサンプルGruntfile.js リンクしたミドルウェアを使用して監視およびライブリロードするためのセットアップです。

20
André Dion

この質問は古いことは知っていますが、別のWebサイトからこの情報を入手しました。同じ問題が発生していたため、質問に関しては機能しているようでした。基本的に、オプションオブジェクトにkeepAlive：trueを追加すると、コードが機能します。

grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
develop: {
  server: {
    file: 'bin/www'
  }
},
watch: {
  options: {
    nospawn: true,
    livereload: reloadPort
  },
  server: {
    files: [
      'bin/www',
      'app.js',
      'routes/*.js'
    ],
    tasks: ['develop', 'delayed-livereload']
  },
  js: {
    files: ['public/js/*.js'],
    options: {
      livereload: reloadPort,
      keepAlive:true
    }
  },
  css: {
    files: [
      'public/css/*.css'
    ],
    options: {
      livereload: reloadPort,
        keepAlive:true
    }
  },
  views: {
    files: ['views/*.ejs'],
    options: {
      livereload: reloadPort,
        keepAlive:true
    }
  }
}

}）;

0
James Daly

Livereload.jsをページに追加しない場合は、chromeプラグイン：

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

このプラグインを使用して、ページの読み込み時にプラグインicoをクリックし、ドットが変更されていることを確認します。その後、ページソースが自動追加されます

0
lidl