webpack: Hot reload triggered multiple times in a row when launching dev server

Hello! I’m submitting a bug report

I’ve been using webpack for a long time and I’ve seen this behaviour on several mac OSX computers. Sometimes, when launching the dev server (either with webpack-dev-server or webpack-dev-middleware), webpack enters a loop when it invalidates and reloads my bundle 3 to 12 times in a row.

This is difficult to reproduce because it happens randomly. It seems to happen more frequently if I kill and restart my server a lot. It looks like a race condition or an FS event bug.

I got this bug with webpack 1 as well as webpack 2 so all versions I used seem to have the same bug.

It’s not a dramatic issue but it’s quite annoying when it happens. I just wanted to make sure that you guys were aware of it and see if other people are experiencing this issue as well.

demo

Webpack version: 1 and 2

Please tell us about your environment: OSX 10.11.6

Current behavior: Webpack sometimes hot reloads multiple times in a row on first start.

Expected/desired behavior: Webpack does not hot reloads on first start.

steps to reproduce

You can randomly see this behaviour with a simple boilerplate like this one. I have seen it happen with isin/nwb, facebookincubator/create-react-app, etc…

About this issue

Original URL
State: closed
Created 8 years ago
Reactions: 10
Comments: 26 (7 by maintainers)

Commits related to this issue

Webpack bug was fixed. I've got tired from it emitting 20 compile ready instead of 1 on first run. See https://github.com/webpack/webpack/issues/2983 and https://github.com/webpack/watchpack/issues/... — committed to tuffjs/tuff-chat by avesus 7 years ago

Most upvoted comments

same issue here webpack 4.4

+17

PerspectivesLab on Apr 4, 2018

I can confirm this bug. It happens about 1 of 5 times in the examples in webpack-dev-server, which use an extremely minimal config. I’m using OSX too.

SpaceK33z on Sep 21, 2016

Also experiencing this issue. Seems to happen only on a start of the server after a hot reload happened. For example : start server, change a file, reload happens, stop server, then restart server > compiler builds a couple of times…

My setup : dev server + webpack-hot-middleware via Node API

wesleymostien on Sep 18, 2017

Issue was closed because of inactivity.

If you think this is still a valid issue, please file a new issue with additional information.

webpack-bot on May 3, 2019

I found add watchOptions can fix this problem

watchOptions: {
  aggregateTimeout: 10000,
  poll: 5000
}

TX-DSS on Feb 17, 2018

To verify the issue the issue I am seeing in webpack-dev-server follow these steps

run npm install sleep
in node_modules/webpack-dev-server/lib/Server.js add require('sleep'); near the top of the file.
search for the line: this._sendStats([conn], this._stats.toJson(clientStats), true);
add the line sleep.msleep(1000); before the line above.

This should make the issue disappear. It seems to be related to sockjs on Chrome. Basically when a reload is triggered the browser connects twice to sockjs server started a loop which triggers more reloads. Putting in a delay allows the first connection to go out of scope.

mcpherson-sa on Dec 5, 2017

This issue had no activity for at least half a year.

It’s subject to automatic issue closing if there is no activity in the next 15 days.

webpack-bot on Apr 18, 2019

I am also seeing this bug.

I have a barebones project (following https://webpack.github.io/docs/tutorials/getting-started/), and every time I change a file, the browser reloads the page multiple times. webpack only compiles once. This only happens in chrome/chromium (v 62), not in firefox.

OS: Ubuntu 16.04

aaroncass on Dec 5, 2017

@LvChengbin please create separate issue with reproducible repo

vankop on Jun 29, 2022

Experiencing the same issue.

Using an express server with webpack, webpack-dev-middleware, webpack-hot-middleware, and react-hot-loader

Happens on save changes. Webpack will bundle the same package up to 8 times.

orpheus on Oct 1, 2017

This issue had no activity for at least half a year.

It’s subject to automatic issue closing if there is no activity in the next 15 days.

webpack-bot on Aug 11, 2017

This is most likely the cause: https://github.com/webpack/watchpack/issues/25

Jessidhia on Sep 30, 2016