[英]I can't get livereload to work when using node.js and gulp
我的gulpfile如下:
var gulp = require('gulp'),
connect = require('gulp-connect'),
sass = require('gulp-ruby-sass'),
autoprefixer = require('gulp-autoprefixer'),
minifycss = require('gulp-minify-css'),
jshint = require('gulp-jshint'),
uglify = require('gulp-uglify'),
imagemin = require('gulp-imagemin'),
rename = require('gulp-rename'),
clean = require('gulp-clean'),
concat = require('gulp-concat'),
notify = require('gulp-notify'),
cache = require('gulp-cache'),
livereload = require('gulp-livereload');
gulp.task('styles', function() {
return gulp.src('main.scss')
.pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.$
.pipe(gulp.dest('css'))
.pipe(rename({suffix: '.min'}))
.pipe(minifycss())
.pipe(gulp.dest('css'));
});
gulp.task('default', function() {
gulp.start('styles');
gulp.start('server');
gulp.start('watch');
});
gulp.task('server', function() {
connect.server({
livereload:true
});
});
gulp.task('indexChange',function(){
console.log('index has changed');
connect.reload();
} );
gulp.task('watch', function() {
gulp.watch('index.html', ['indexChange']);
});
當我更改index.html文件時,將運行'indexChange'任務,並且控制台輸出'index has changes',但是connect.reload()卻無濟於事。
我已經檢查了liverload端口和連接服務器端口,因此我知道它們都在運行。 但是我無法弄清楚缺少什么代碼才能使livereload正常工作。
我究竟做錯了什么?
您需要將管道返回到connect.reload();中。 為使其正常工作,請嘗試以下操作:
// add gulp-watch
var watch = require('gulp-watch');
gulp.task('indexChange',function(){
console.log('index has changed');
} );
gulp.task('watch', function() {
watch({glob: './index.html'}, ['indexChange']).pipe(connect.reload());
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.