React应用package.json中browserslist是否支持Brave浏览器？

你当前React项目中package.json内的browserslist配置如下：

"browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }

Brave浏览器不需要单独在browserslist中添加配置，现有last 1 chrome version规则已经完全覆盖适配需求。
Brave基于Chromium内核开发，其渲染引擎、JS执行环境、CSS特性支持与对应大版本的Chrome完全对齐，babel、autoprefixer等工具基于Chrome规则生成的polyfill、CSS前缀、语法降级结果完全兼容Brave。另外browserslist官方的兼容浏览器列表中没有独立的Brave条目，强行添加类似last 1 brave version的自定义规则会直接导致构建流程报错。

你遇到的页面缩放比例偏小、功能大面积失效问题和browserslist配置无关，属于Brave自身功能或设置对本地开发环境的误处理，按以下优先级排查即可：

• 校验站点独立缩放设置
  Brave支持为单个域名持久化保存缩放比例，打开本地服务页面后，查看地址栏右侧的缩放控件，确认当前localhost的缩放值为100%。如果之前误触Ctrl/Command加减号的缩放快捷键把localhost的缩放比例调小，就会出现页面整体偏小、显示距离过远的问题。
• 临时关闭Brave Shields防护测试
  Brave默认开启的Shields盾牌防护会对页面脚本、接口请求、本地存储写入做严格的安全拦截，很容易把本地开发环境的热更新脚本、调试接口请求、前端存储操作判定为用户追踪行为拦截：
  • 打开localhost页面后点击地址栏上的Brave盾牌图标
  • 临时关闭当前站点的Shields总开关，刷新页面验证功能是否恢复
  • 如果不需要全关Shields，可以单独把跟踪广告拦截等级调低为Standard，关闭防指纹相关选项后测试
• 排查硬件加速兼容问题
  部分历史版本的Brave在开启硬件加速时，会出现视口单位（vw/vh）计算偏差、CSS transform渲染异常的问题，导致页面整体缩放错位。在Brave设置页搜索Hardware acceleration，临时关闭硬件加速选项，重启浏览器后再访问本地服务测试。
• 排查扩展冲突
  部分广告拦截、脚本管理类浏览器扩展不会自动豁免localhost域名，会拦截本地静态资源、接口的加载。可以打开Brave无痕窗口（默认禁用所有扩展）访问本地服务，如果无痕模式下页面表现正常，逐个禁用扩展定位冲突项即可。

内容的提问来源于stack exchange，提问作者hunter_l