Gulp 中使用 browser-sync 无法热重载

问题描述

问 题

楼主使用 gulp 中文网的文章 http://www.gulpjs.com.cn/docs... 进行配置。

目录如下：

sass
  dist
    sass
      a.css
    index.html

配置如下(gulpfile.js 文件在 sass 目录下）：

let gulp = require('gulp');
let browserSync = require('browser-sync');
let reload = browserSync.reload;

gulp.task('server', function() {
  browserSync({
    server: {
      baseDir: 'dist'
    }
  });

  gulp.watch(['*.html', 'sass/*.css'], {cwd: 'dist'}, reload);
});

在命令行 gulp server 后，localhost:3000 确实可以启动，但是动态修改 a.css 文件并不能反映在 localhost:3000 中。

没能找到 gulp+browser-sync 的官方配置文章，看到有的文章用的是 browserSync 的 create，init 方法，一头雾水 ...

搜索了相关文章，都没能解决这个问题，求教。

补充：当修改 a.css 保存后，控制输出 Reloading Browsers...，但是浏览器却没有刷新

解决方案

解决了，是 HTML 文件没有写完整，broswer-sync 默认需要 body tag，详见 https://github.com/BrowserSyn...

看来写 demo 也要写完整了啊

这篇关于Gulp 中使用 browser-sync 无法热重载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！