更改 *.js 文件后，页面重新加载非常缓慢（~30sec-2min）[express+gulp+gulp-nodemon+browser-sync]答案

【问题标题】：After changes in *.js files, page reloads very slowly (~30sec-2min) [express+gulp+gulp-nodemon+browser-sync]更改 *.js 文件后，页面重新加载非常缓慢（~30sec-2min）[express+gulp+gulp-nodemon+browser-sync]
【发布时间】：2016-11-11 04:37:06
【问题描述】：

我正在使用 express.js 开发应用程序。我还使用 gulp 与 gulp-nodemon 和 browser-sync 来简化我的开发并提供 *.js 的自动更新、*.html 和 *.css 文件，而我正在处理项目。

但我有个问题！

当我对 *.css 或 *.html 文件进行更改时，browser-sync 会自动更新或自动重新加载在几毫秒内立即。但是当我对 *.js 文件进行更改时，自动重新加载需要几分钟。这是一个非常奇怪的行为！正如我在对 *.js 文件进行更改时观察到的那样本地主机：3000。但此请求等待大约 2 分钟，就在该页面重新加载并应用新更改之后。

为什么重新加载页面需要这么长时间？以及如何解决这个问题？感谢您的帮助！

这是我的 gulpfile.js

const gulp = require('gulp');
const nodemon = require('gulp-nodemon');
const browserSync = require('browser-sync').create();

gulp.task('default', ['browser-sync']);

gulp.task('browser-sync', ['nodemon'], function() {
    browserSync.init(null, {
        proxy: "http://localhost:3000",
        files: ["public/**/*.*", "views/**/*.*"],
        port: 7000
    });
});

gulp.task('nodemon', function(cb){
    var started = false;
    return nodemon({
        script: 'bin/www'
    }).on('start', function() {
        // to avoid nodemon being started multiple times
        if (!started) {
            cb();
            started = true;
        }
    });
});

这是开发工具上网络部分的快照。在这里您可以看到 *.js 文件更改后重新加载页面需要多长时间 image

【问题讨论】：

标签： express gulp browser-sync nodemon

【解决方案1】：

我遇到了同样的问题。因此，我尝试像这样更改我的 gulpfile：

gulp.task('browser-sync', ['nodemon'], function() {

    browserSync.init(null, {
        proxy: "http://localhost:8080",
        //files: ["public/**/*.{css,html,js}"], //Commented
        browser: "google chrome",
        port: 8080
    });

    gulp.watch("public/**/*.{css,html,js}").on('change', browserSync.reload);
});

我希望它对你有用。请试一试。

【讨论】：