BrowserSync keeps reloading infinitely upon JavaScript changes

I had the same problem. I resolved the problem by removing the yarn.lock file, the .cache-loader folder and the node_modules folder. Then I ran yarn && yarn watch.

1 Like

I had the same problem, But the problem wasn’t ocurring only with JS, but mainly with it.

For some reason, my publicPath was configured as:

“publicPath”: “/wp-content/themes/theme-name”

I checked in anouther project that I also use Sage, in which I didn’t have this probblem. And it was configured as:

“publicPath”: “/app/themes/theme-name”

So, I’ve changed the former to the second pattern, and the problem gone.

This is very strange, because the config.json is generated automatically.

Both projects were generated in the same machine. Could this be related to an update on Sage?

First I tryed deleting yarn.lock file, .cache-loader folder and the node_modules folder. I had problems running yarn after. I had to restore yarn,lock.

3 Likes

Out of the blue, one of my many Sage installs started to loop with Ignored an update to unaccepted module today (same as sadikyalcin’s msg above).

The only thing I can really add here is that Safari seems more robust und in fact does not end up in a reload loop. I cannot use Chrome for development for this single WP install / theme right now, not even in incognito mode. I can’t explain the difference in behavior between the browsers. I have cleared the cache, restarted the computer, and tried (nearly) all of the tricks mentioned in this thread.

I tried also a few other similar themes, and they don’t loop the same way. After I save a JS file, they do show the same message and reload but they don’t loop.

An update to my previous message: the problem disappeared as suddenly and unexpected as it first appeared.

Honestly, I spent hours trying to resolve the issue in the first place - nothing seemed to help. Then I did nothing, just tried a few days later and the problem was gone.

I was having the same issue and had a slash at the end of the devUrl.

Once I removed it, problem solved.

1 Like

Thanks, that worked for me!

This came up in another thread: Is it possible to "watch" without browsersync?

I’m guessing the mod might be useful also in persistent reload loop situations, where nothing else seems to help. I don’t have a failing env at hand right now to try with, but will definitely give it a shot should a need arise.

Out of the blue this happens inconsistently whenever I run yarn start. I’ve tried dumping the .cache-loader, node modules and yarn.lock.

This is happening on more than one Sage theme BTW.

I can’t figure out what went wrong or how to fix it. It happens in Chrome and Firefox.

Isn’t this then a BrowserSync issue and a new issue should be created in BrowserSync GitHub repo?
An URL should be normalized (extra slashes removed) or at least those extra slashes ignored and not resulting in completely counterproductive behaviour, like endless refresh loops?

Same problem here now on Sage 9.0.9. Tried and checked all said in this thread. No solution. It’s unusable… anyone could help?

It also took me a loooong time and I refused to think my config was wrong but indeed it was.

Even though I used a docker image to spin up wordpress and the relative path would be sth. like "/themes/my-theme" I needed to set the public path like this instead:

"publicPath": "/wp-content/themes/my-theme",

The rest of the config (for completeness):

"devUrl": "http://localhost:84",
"proxyUrl": "http://localhost:3000",

I thought the path must be correct otherwise it wouldn’t be able to work at all but it really only happened sporadically and changing the path fixed the issue permanently to me. I think this is more or less what already has been said in this thread but tribble check your publicPath (especially when using docker)!

For new projects I shifted to Valet instead of docker and this works out of the box now :slight_smile: Hope this may help you @dangelion.

3 Likes

Started a new project today and as usual it happens this issue, that makes development a pain in the ass. Like always I checked all and all and all again and again and obviously publicPath is one the first thing I checked and it was always correctly set ("/wp-content/themes/my-theme"). Finally as always the only thing it seems to solve is what I wrote here:

that is

sudo rm -rf $(xcode-select -print-path)
xcode-select --install

Very very annoying!
Any other idea?

Same issues on some project sometimes. Works other times, no clue why. Tried the above solutions to no avail.

I have been having the same issue tried everything until today.
I setup and ran the project through a virtual host and had no issues at all.
You can follow these instructions
https://www.google.com/amp/s/www.cloudways.com/blog/configure-virtual-host-on-windows-10-for-wordpress/amp/
Don’t forget to update the devurl name in your config.json and .env files to the same as your servername.
Hope this helps.

2 years later the loop is killed by clear cache… Thanks!!!

you just saved my life!

I had exactly the same problem that I solved changing the pubic path to /wp-content/themes/my-theme

I’m not really sure why honestly, so if anyone knows, I’d be interested!

1 Like

Is this Sage 9.x? In this case an update was recently merged that should fix most or all issues,
is your theme Sage 9.x based and have you updated your theme?

Thanks for answering. It’s Sage 9.0.10, I just started a new project.

For me, the issue was with a caching plugin (Hummingbird). Use the caching plugin to clear your cache or simply disable it and it should resolve the infinite reloading.