Browser-sync + Gulp - 如果没有服务器正在运行，则重新加载失败答案

【问题标题】：Browser-sync + Gulp - Reloading fails if no server is runningBrowser-sync + Gulp - 如果没有服务器正在运行，则重新加载失败
【发布时间】：2015-07-04 20:36:25
【问题描述】：

我正在构建我的 gulpfile，但遇到了浏览器同步问题。我试图在gulp.dest() 之后在 html 任务中重新加载我的浏览器，但它一直失败。这是 gulpfile 中失败的部分。

var gulp        = require('gulp'),
    runSequence = require('run-sequence'),
    server      = require('browser-sync'),
    $           = require('gulp-load-plugins')();

gulp.task( 'html', function () {
    return gulp.src( 'path/to/html/*.html' )
        .pipe( $.fileInclude() )
        .pipe( gulp.dest( 'path/to/dest/' ) )
        .pipe( server.reload() );
});

gulp.task( 'serve', ['html'], function () {
    server({
        server: {
            baseDir: 'path/to/directory/'
        }
    });

    gulp.watch( 'path/to/html/*.html', ['html'] );
});

我确定问题出在重新加载部分，因为当我将其注释掉时，一切正常。我很感激这方面的任何帮助，因为我已经坚持了很长时间了。提前致谢！

【问题讨论】：

server 在哪里初始化？
初始化是什么意思？我需要文件顶部的所有内容。
感谢您添加require 电话，这正是我不清楚的地方。问题是否源于您在serve 中启动服务器之前reload() 服务器？
是的，没问题！我以前应该这样做的。是的，这可能就是它发生的原因，但这有点棘手，因为我需要在没有服务器运行的情况下调用 html 任务。一种解决方案是创建两个不同的任务，但我不想走那条路。奇怪的是，使用server.stream() 时不会出现这个问题。

标签： javascript gulp reload browser-sync

【解决方案1】：

这应该可以解决您的问题：

var gulp = require('gulp');
var browserSync = require('browser-sync');
var plumber = require('gulp-plumber');
var $ = require('gulp-load-plugins')();

gulp.task( 'build-html', function () {
  return gulp.src( 'path/to/html/*.html' )
    .pipe(plumber())
    .pipe( $.fileInclude() )
    .pipe( gulp.dest( 'path/to/dest/' ) );
});

gulp.task('serve', ['build-html'], function(done) {
  browserSync({
    open: false,
    port: 9000,
    server: {
      baseDir: ['.']
    }
  }, done);
});

function reportChange(event){
  console.log('File ' + event.path + ' was ' + event.type + ', running tasks...');
}

gulp.task('watch', ['serve'], function() {
  gulp.watch('path/to/html/*.html', ['build-html', browserSync.reload]).on('change', reportChange);
});

【讨论】：

【解决方案2】：

也许那是老式的，但是，这就是你应该初始化的方式。

var browserSync = require('browser-sync').create();
var reload = browserSync.reload;

然后这样称呼它

.pipe(reload())

【讨论】：