hexo 本地启动项目 hexo-browsersync 不工作原因总结

问题 1 ： hexo-server 开启 compress 压缩后 hexo-browsersync 插件热更新完全无效，没办法自动刷新

此问题表现在 hexo 任何版本

问题原因：

hexo-server 依赖 compression^1.7.4 会自动安装 compression@1.8.0，压缩后 Content-Encoding 不是 gzip 而是 br， hexo-browsersync 无法解析 br 压缩内容，从而导致自动刷新失效。

解决办法：

方法1. 关闭 compress 压缩，但是关闭后会出现长内容被截断，要处理长内容截断，只能把 hexo-browsersync 插件移除或者开启 compress 压缩。

方法2. 手动将 compression@1.8.0 依赖的 negotiator@0.6.4 内容 node_modules/compression/node_modules/negotiator/index.js 替换为 0.6.3 版本， 0.6.3 版本内容可以在 https://npmmirror.com/package/negotiator/files/index.js?version=0.6.3 查看。

方法3. package-lock.json 文件中将 hexo-server 依赖的 "compression": "^1.7.4", 改为 "compression": "1.7.4", 让其强制安装 compression@1.7.4 版本，并且删除已保存的 compression 1.8.0 json 段落，然后删除 node_modules 重新运行 npm install 安装依赖即可。

问题 2 ： hexo-server 偶尔内容空白和内容截断，导致 hexo-browsersync 插件热更新失败

此问题表现在 hexo 版本： v4.2.0

问题原因：

hexo-server 返回的 Content-Length 是错的, 比实际内容短，导致浏览器截断内容。

解决办法：

hexo-server 的 配置文档 有一项 compress 配置，一般服务器对内容压缩都会使用流式压缩，即不会使用 Content-Length 预设页面的长度。经测试，可解决该问题，解决方法：根目录配置文件 _config.yml 添加如下代码：

# hexo-server配置
server:
  # 此配置解决偶尔实时刷新无效和长文章被截断问题
  compress: true

注意：hexo 不同版本可能配置字段名不一样！

问题 3 ： hexo-server 保存文章时候内容空白问题

此问题表现在 hexo 版本： v4.2.0

问题原因：

刷新过快，导致文件编译未完成，没有内容响应。

解决办法：

node_modules/hexo/lib/box/index.js 246 行：

watcher.on('change', path => {
  this._processFile(File.TYPE_UPDATE, getPath(path));
});

改为

let timer = null;
watcher.on('change', path => {
  clearTimeout(timer);
  timer = setTimeout(() => {
    this._processFile(File.TYPE_UPDATE, getPath(path));
  }, 60);
});

如果设置 60 毫秒后还有问题，可以将 60 再改大一点。

此处加上的 setTimeout 还有一个好处，可以节流，短时间内多次保存当做一次处理。