Javascript Gulp browserSync不自动重新加载

我已经阅读了关于这个话题的每一篇教程、stackoverflow问题、讨论论坛，但仍然找不到适合我的解决方案。我确信我忽略了一些简单的事情，这就是我寻求帮助的原因。这是我的文件夹结构供参考

• 距离
  • css
  • img
  • js
  • index.html
• src
  • 无礼
  • img
  • js
  • index.html
• gulpfile.js
• package.json

browserSync将正确初始化并在浏览器中显示页面。但是，当我对html、css或js文件进行更改时，终端会告诉我它正在重新加载浏览器，但浏览器永远不会重新加载。如果我手动刷新浏览器，那么更改将正确显示，但browserSync应该自动刷新，对吗

我是否需要生成某种返回流或.pipe（browserSync.stream（））；在我的复制任务结束时

var gulp = require("gulp"),
    browserSync = require("browser-sync").create(),
    sass = require("gulp-sass"),
    autoprefixer = require("gulp-autoprefixer"),
    jasmine = require("gulp-jasmine-phantom"),
    concat = require("gulp-concat"),
    uglify = require("gulp-uglify"),
    babel = require("gulp-babel"),
    sourcemaps = require("gulp-sourcemaps"),
    imagemin = require("gulp-imagemin");

gulp.task("default", ["styles", "copy-html", "copy-img", "scripts", "browser-sync", "watch"], function(){
});

gulp.task("watch", ["browser-sync"], function() {

    gulp.watch("src/img/*", ["copy-img", browserSync.reload]);
    gulp.watch("src/index.html", ["copy-html", browserSync.reload]);
    gulp.watch("src/sass/**/*.scss", ["styles", browserSync.reload]);
    gulp.watch("src/js/**/*.js", ["scripts", browserSync.reload]);
});

gulp.task("browser-sync", function(){
    browserSync.init({
        server: {
            baseDir: "dist/"
        }
    });
});

gulp.task("styles", function () {
    return gulp.src("src/sass/**/*.scss")
        .pipe(sass({outputStyle: "compressed"}).on("error", sass.logError))
        .pipe(autoprefixer({
            browsers: ["last 2 versions"],
            cascade: false
        }))
        .pipe(gulp.dest("dist/css"));
});

gulp.task("copy-html", function() {
    return gulp.src("src/index.html")
        .pipe(gulp.dest("./dist"));

});

gulp.task("scripts", function() {
    return gulp.src("src/js/**/*.js")
        .pipe(babel())
        .pipe(sourcemaps.init())
        .pipe(concat("all.js"))
        .pipe(uglify())
        .pipe(sourcemaps.write())
        .pipe(gulp.dest("dist/js"));
});

gulp.task("copy-img", function() {
    return gulp.src("src/img/*")
        .pipe(imagemin())
        .pipe(gulp.dest("dist/img"));
});

gulp.task("tests", function() {
    gulp.src("tests/spec/extraSpec.js")
        .pipe(jasmine({
            integration: true,
            vendor: "src/js/**/*.js"
        }));
});

我还想知道package.json文件中的依赖项是否正确

{
    "title": "Matthew J. Whitney - Portfolio Site",
    "name": "portfolio-site",
    "description": "A smooth scrolling navigation built with Bootstrap",
    "keywords": [
        "css",
        "sass",
        "html",
        "responsive",
        "javascript"
    ],
    "homepage": "https://www.matthewjwhitney.com",
    "author": "Matthew J. Whitney",
    "repository": {
        "type": "git",
        "url": "https://github.com/matthewjwhitney/portfolio-site.git"
    },
    "dependencies": {
        "ajv": "^6.4.0",
        "babel-core": "^6.26.3",
        "bootstrap": "^4.0.0",
        "gulp-clean-css": "^3.9.3",
        "gulp-cssnano": "^2.1.3",
        "gulp-htmlclean": "^2.7.22",
        "gulp-inject": "^4.3.2",
        "gulp-rename": "^1.2.2",
        "gulp-webserver": "^0.9.1",
        "jquery": "3.3.1",
        "jquery.easing": "^1.4.1",
        "phantomjs": "^2.1.7",
        "popper": "^1.0.1",
        "popper.js": "^1.14.3"
    },
    "devDependencies": {
        "browser-sync": "^2.23.6",
        "del": "^3.0.0",
        "eslint": "^4.19.1",
        "eslint-plugin-react": "^7.7.0",
        "gulp": "^3.9.1",
        "gulp-autoprefixer": "^5.0.0",
        "gulp-babel": "^7.0.1",
        "gulp-cache": "^1.0.2",
        "gulp-concat": "^2.6.1",
        "gulp-eslint": "^4.0.2",
        "gulp-imagemin": "^4.1.0",
        "gulp-jasmine-phantom": "^3.0.0",
        "gulp-sass": "^4.0.1",
        "gulp-sourcemaps": "^2.6.4",
        "gulp-uglify": "^3.0.0",
        "gulp-useref": "^3.1.5",
        "run-sequence": "^2.2.1"
    }
}

---

这是如果有帮助的话。这真的快把我逼疯了，所以我希望有人能也会帮助我。谢谢！：）

我下载了您的repo以检查它，您的Gulp安装一切正常

您的问题是index.html文件格式不正确。在文件的开头，文档声明之前有一个词“portfolio”

我在其他一些答案中读到，BrowserSync需要在HTML中插入一个body标记来注入一些代码来启用同步，我猜格式错误的HTML可能会破坏该功能

---

谢谢，

你在多个浏览器中试用过吗？@TheodorB，是的，我用chrome canary、chrome和safari试用过，效果都一样。谢谢。试着检查一下开发工具的网络标签，有什么错误吗？@TheodorB，没有错误。啊，非常感谢。有一个我正在玩的吞入注射节点，我想出于某种原因，它会自动添加到其中。我没想到要把它拿走。我知道这是我忽略的小东西！谢谢,谢谢。这让我发疯，因为我知道我的gulpfile.js是正确的！我有重新加载的问题。当我插入body标签时，问题立即得到解决。谢谢哇！这解决了我的一个重新加载问题。由于我遇到了与上面相同的问题，我不明白为什么BrowserSync在上述情况下不抛出错误？