Javascript 如何使浏览器同步以查看文件并自动导航到更改/添加的文件

我正在处理许多.html文件，希望浏览器同步自动导航到更改的文件

浏览器同步已启动，浏览器显示<代码>http://localhost/file-01.html

编辑

文件-42.html

，点击保存

浏览器同步导航到

http://localhost/file-42.html

通常，如果我保存

file-42.html

file-01.html

并将其重新加载到浏览器中，这是没有用的。我想在保存时保持编辑器和浏览器的同步

---

我可以使用什么来获得这种行为？

我以前可以在中执行，但现在不再维护，而且有bug，因此我必须移动到另一个本地开发服务器

也没有这个功能

在浏览器同步中我可以通过滥用

//gulpfile.js
const gulp=需要（“gulp”）；
const bs=require（'browser-sync'）。create（）；
自动导航功能（cb）{
b.init({
//不要重新加载*.html，而是自动导航到已更改
忽略：['*.html'，'gulpfile.js']
通知：正确
});
bs.watch（'*.html'，（事件、文件）=>{
如果（事件=='change'）{
通知（``）；
}
如果（事件=='add'）{
通知（``）；
}
//需要取消抖动或重命名事件404
如果（事件=='unlink'）{
//已删除文件，请导航到索引
b.通知（“”）；
}
});
cb（）；
}
exports.service=自动导航；

这是一个黑客解决方案，尽管它的优点是它只是服务器端的。任何页面都可以自动导航，而不需要任何客户端代码来接收和解释来自服务器的消息

有没有合适的方法来获得这种行为

bs.reload（'file-42.html

）`不起作用。我已经看过API了，也许我错过了什么

// gulpfile.js
const gulp = require('gulp');
const bs = require('browser-sync').create();

function autoNavigate (cb) {
  bs.init({
    // Don't reload *.html, auto-navigate to changed instead
    ignore: ['*.html', 'gulpfile.js']
    notify: true
  });

  bs.watch('*.html', (event, file) => {
    if (event === 'change') {
      bs.notify(`<meta http-equiv="refresh" content="0; url=/${file}" />`);
    }
    if (event === 'add') {
      bs.notify(`<meta http-equiv="refresh" content="0; url=/${file}" />`);
    }
    // Needs debouncing or else rename events 404
    if (event === 'unlink') {
      // File removed, navigate to index
      bs.notify('<meta http-equiv="refresh" content="0; url=/" />');
    }
  });

  cb();
}

exports.serve = autoNavigate;