2016-03-19 18 views
1

これは重複した質問のように思えるかもしれませんが、私は問題の根本を特定するのに役立つリソースをすべて読んでいます。ブラウザはgulpとlivereloadでリロードしません

jadeファイルをコンパイルした後、gulpをChromeにリロードしようとしています。私filestructureがある

var gulp  = require('gulp'), 
    jade  = require('gulp-jade'), 
    connect = require('gulp-connect'); 

gulp.task('jade', function() { 
    return gulp.src('src/*.jade') 
     .pipe(jade({pretty: true})) 
     .pipe(gulp.dest('dev/')) 
     .pipe(connect.reload()) 
}); 

gulp.task('connect', function() { 
    connect.server({ 
     livereload: true, 
     root: 'dev', 
     debug: true 
    }); 
}) 

gulp.task('watch', function() { 
    gulp.watch('src/*.jade', ['jade']); 
}); 

gulp.task('default', ['connect', 'watch']); 

. 
├── dev/ 
│ └── index.html 
├── node_modules/ 
├── src/ 
│ └── index.jade 
├── gulpfile.js 
└── package.json 

コマンドラインでgulpを入力すると、すべてが正常であるように思われる。私は私のgulpfile.jsのためにこれを持っています私のjadeファイルは保存されるたびにコンパイルされますが、Chromeはリフレッシュされません。いくつかの発言:

  • 私はクロームにインストールLiveReload拡張子を持ち、かつ拡張機能のアイコンは、私がhttp://localhost:8080
  • の午前とき、私はChromeで「アクセスがURLをファイルに許可する」eneabledいる「LiveReloadが接続されている」と言いますLiveReload拡張機能の拡張設定。
  • gulpが実行されている場合、http://localhost:35729はjson {"tinylr":"Welcome","version":"0.2.1"}を返します。
  • 私はこれをWindowsとLinuxの両方でうまくやってみました。

答えて

1

gulp-connectの最新バージョンでは、ライブリロードが確実に機能しないようです。Livereload is broken since 3.0.0を参照してください。

[email protected]を使用してGulpfileを試してみましたが、ライブリロードできなかった。しかし、2.3.1gulp-connectにリンクされた問題のスレッドで提案されているように戻って問題を修正しました。試してみる価値があるかもしれません。

+1

ありがとうございます。確かに 'npm install --save-dev gulp-connect @ 2.3.1'がこのトリックを行った。 – breeden

関連する問題