ERR_CONTENT_LENGTH_MISMATCH sur browsersync.reload

Question

J'utilise browsersync.reload() lorsque l'empaquetage est terminé. À première fois, il a bien fonctionné, mais après application est grossissait, la page Web n'a pas réussi à charger JavaScript sur reload avec ce message:

GET http://localhost:4000/js/bundle.js net :: ERR_CONTENT_LENGTH_MISMATCH

Ceci est mon gulpfile. js code:

function serve() { 
    let serverStarted = false; 

    nodemon({ script: 'server.js' }) 
    .on('start',() => { 
     if(!serverStarted) { 
      serverStarted = true; 

      browserSync.init(null, { 
       proxy: `localhost:${config.port || 3000}`, 
       port: config.proxyPort || 4000 
      }); 

      gulp.watch(`${SRC_DIR}/html/**`, buildHtml); 
      gulp.watch(`${SRC_DIR}/scss/**`, buildScss); 

      gulp.watch(`${BUILD_DIR}/html/index.html`).on('change', browserSync.reload); 

      // return empty stream 
      return gutil.noop();  
     } 
    }); 
} 

J'utilise la synchronisation du navigateur avec express, donc j'ai utilisé un proxy. Ci-dessous le code est partie pour le script regroupement:

function buildJs() { 
    const b = persistify() 
    .add(`${SRC_DIR}/js/index.js`) 
    .on('update', bundle) 
    .on('log', gutil.log) 

    function bundle() { 
     let stream = b.bundle() 
     .on('error', swallowError) 
     .on('end',() => { 
      gutil.log(`Building JS:bundle done.`); 
      browserSync.reload(); 
     }) 
     .pipe(source('bundle.js')); 

     return stream.pipe(gulp.dest(`${BUILD_DIR}/js`)); 
    } 

    return bundle(); 
} 

J'utilise persistify pour rapide builds, il fonctionne avec watchify, donc je ne l'ai pas utilisé la montre. Comme vous pouvez voir l'événement 'end', qui se déclenche lorsque le groupage est terminé, j'ai appelé browerSync.reload pour recharger la page.

Recharger lui-même n'est pas un problème, mais il échoue charger JavaScript comme je l'ai dit titre.

Est-ce que persistifier l'événement de fin déclenché si tôt? ou est-ce que quelque chose de problème d'exprès/navigateur-synchro? Je ne peux deviner que l'événement de fin a été déclenché mais le flux est toujours en train d'écrire le fichier, donc la taille réelle du fichier n'est pas correcte et refuse d'obtenir.

Intentionally j'ai donné quelques retards avant browsersync.reload(), ça marche mais je ne veux pas faire ça.

Y at-il quelque chose que j'ai raté? Ou est-ce que j'ai mal fait? Tout conseil sera très apprécié.

Answer 1

Je résolvais ce problème en exécutant JavaScript après le démarrage de la synchronisation du navigateur. Je ne sais toujours pas pourquoi cela s'est produit mais il semble que le script a été déplacé et que le navigateur essaie d'y accéder alors qu'il fonctionne toujours.