prevent reloading when unrelated file changed

[kentor]

Say I have index.html and about.html. If I have my browser opened to about.html and update index.html, there's a full page reload. Is there a way to prevent that? Or maybe I'm doing something wrong?

Using this to launch browser-sync:

var browserSync  = require("browser-sync").create();
var htmlInjector = require("bs-html-injector");

browserSync.use(htmlInjector, {
  files: "*.html",
});

browserSync.init({
  files: "*.css",
  logLevel: 'debug',
  server: '.',
});

directory:

.
├── about.html
├── app.css
├── bs.js
├── index.html
└── package.json

[giathinh910]

I also have the same issue. Here is my config:

browserSync: {
    bsFiles: {
        src: [
            "<%= dest_css %>/*.css",
        ]
    },
    options: {
        watchTask: true,
        proxy: "http://localhost/",
        plugins: [
            {
                module: "bs-html-injector",
                options: {
                    files: "<%= dest %>/*.html"
                }
            }
        ]
    }
},

Firstly, there is still an injection of html snippet when I make change but right after that,the page fully reload. Is there anything wrong with my config. Thanks for your help.

[Kristinita]

Status: Reproduced 🔁

Browsersync reloads browser tabs regardless of whether the bs-html-injector plugin is installed and enabled in the configuration or not. I can’t find a method to prevent this behavior.

Environment

1. Windows 11 [Version 10.0.22621.2861]
2. Node.js v21.6.1
3. npm 10.3.0
4. browser-sync 3.0.2
5. bs-html-injector 3.0.3

Thanks.