Hexo hexo-browsersync插件

对于使用 Hexo 搭建博客的开发者来说，hexo server 命令虽然能在本地启动服务预览站点，但每次修改文章或主题后都需要手动刷新浏览器才能看到变化，这种反复切换窗口的操作在频繁调试时尤其繁琐。

hexo-browsersync 插件正是为了解决这个问题而生——它将 BrowserSync 强大的实时预览能力无缝集成到 Hexo 的本地开发工作流中。

介绍

hexo-browsersync 是 Hexo 官方团队（hexojs）维护的 BrowserSync 集成插件，采用 MIT 开源协议。

其核心价值在于将 BrowserSync 的实时预览、跨设备同步浏览、自动刷新、CSS 热重载及请求代理等功能嵌入 Hexo 开发流程。

不同于简单的 LiveReload，BrowserSync 还支持多设备协同调试——在局域网内，多台设备访问同一网址时，页面滚动、点击等操作可以同步联动，极大提升了响应式测试的效率。

安装

安装过程非常简单，在 Hexo 项目目录下执行：

npm install hexo-browsersync --save

安装完成后，插件的使用是“透明”的——你不需要改变任何操作习惯，只需像往常一样运行 hexo server 或 hexo s，即可自动获得 BrowserSync 的全部特性。

启动成功后，浏览器中打开的本地站点便会支持实时刷新。

配置

虽然插件开箱即用，但你也可以在 Hexo 的 _config.yml 文件中进行自定义配置。例如：

browsersync:
  logLevel: "warn"
  ghostMode:
    scroll: true
  instanceName: "uniqueString"

• logLevel：控制控制台日志级别，设为 "warn" 可抑制冗余信息。
• ghostMode：启用跨窗口/跨设备的滚动、点击等操作同步，对多屏调试非常实用。
• instanceName：为 BrowserSync 实例指定唯一标识符，避免同一机器上多个 Hexo 项目同时运行时产生端口冲突。

完整的 BrowserSync 配置选项可参考官方文档。