Sage 10: BrowserSync refresh loop

Hi, I’m working on this project from months and never had problems. Today after launching yarn start I get localhost:3000 to refresh itself in loop.
Some pages works, some others fall in this loop.
http://myproject.test works perfectly so I’m thinking it’s BrowserSync related.

I tried all: reinstall dependencies and rebuilding assets, deleted yarn.lock restart mac, reinstalled the project from scratch from git, using npm in place of yarn, cleared browsers cache, uninstalled and reisintalled the browser, restart web server, etc

I get this problem in Chrome and Firefox but not in Safari (and Chrome anonymous), so I thought it was a cache problem but I cleared all the possible cache (plus keeping open the inspector tools with Disabled cache).

I’m desperate, can’t work anymore on this project…
Please, some help?

For completeness here my webpack.mix.js that I never changed from the beginning (plus it’s the same I use on other Sage 10 projects that actually work):

const mix = require('laravel-mix');
require('@tinypixelco/laravel-mix-wp-blocks');

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Sage application. By default, we are compiling the Sass file
 | for your application, as well as bundling up your JS files.
 |
 */

mix
  .setPublicPath('./public')
  .browserSync('myproject.test');

mix
  .sass('resources/styles/app.scss', 'styles')
  .sass('resources/styles/editor.scss', 'styles')
  .sass('resources/styles/admin-styles.scss', 'styles');

mix.options({
  processCssUrls: false,
  cssNano: {calc: false},
});

mix
  .js('resources/scripts/app.js', 'scripts')
  .js('resources/scripts/customizer.js', 'scripts')
  .blocks('resources/scripts/editor.js', 'scripts')
  .extract();

mix
  .copyDirectory('resources/images', 'public/images')
  .copyDirectory('resources/fonts', 'public/fonts');

mix
  .sourceMaps()
  .version();

Same problem here!
Can somebody help?

As a first step, check the JavaScript console for warnings/errors.
Also check the Network tab for recurrent, cancelled connections by BrowserSync.

No errors/warnings in console.

How can I check the other thing?

Here is my network tab:

Does this help?

So you experience a reload loop, BrowserSync reloads the whole page over and over again, and no styles are updated without reloading?

Yes “BrowserSync reloads the whole page over and over again”, I can’t work on it, in any way.

The link is for Sage 9, I’m using Sage 10

This should be independent from the Sage version as BrowserSync is used in both 9 and 10 with the same underlying issues and options.

It seems the problem is WPML related. In specific it was the option that automatically redirect the user basing on browser language:

Disabling it there isn’t the issue anymore…
Any idea why and how to solve this conflict?

1 Like

This topic was automatically closed after 42 days. New replies are no longer allowed.