Browsersync no longer works

Question

I'm learning Laravel in combination with Vue and I installed Browsersync to make the process smoother. When I first installed it worked flawlessly.

My setup is the following:

• Browsersync installed locally with npm i browser-sync --save-dev
• Project location: C:\WEB\project_folder\
• php -S localhost:8000 -t public to serve the app. If I go to localhost:8000 it works as expected
• added mix.browserSync({proxy: 'localhost:8000', browser: "C:\\Program Files (x86)\\Google\\Chrome Beta\\Application\\chrome.exe", notify: false}); in webpack.mix.js
• npm run watch to build and run Browsersync

Strange thing is that the Browsersync UI works properly if I acces localhost:3001, even from another device in the network.

I observed it wasn't working anymore while creating another project where I use Parcel for bundling instead of webpack/laravel-mix. There I use the Browsersync CLI, running .\node_modules\.bin\browser-sync start --proxy localhost:8000 --no-notify --cwd 'C:\WEB\project_folder' -f 'public'

I did not update Node, npm or the OS in the meantime. The only thing I installed is the game Valorant which has some fancy anti cheat service that is installed, but I disabled that service.

I tried:

• multiple browsers and devices
• switching the order in which I start the server and Browsersync
• the development folder was on another partition and I recently moved it to C: so I tried moving the project in the previous location
• thinking really hard about the meaning of life :)

I guess next time I will use Docker to have a isolated environment.

I'm stumped. Any ideas? Have anyone encountered and solved this?

Answer 1

This was possibly caused by Windows. I've installed kb4571744 and everything works again.