reactjs - 如何禁用显示“未处理的拒绝（错误）：XXXXX”的反应开发错误面板？

Question

未处理的拒绝（错误）

Unhandled Rejection (Error): User does not exist
(anonymous function)
src/service/index.ts:102
   99 | if (customConfig.rawData) return res.data
  100 | if (res.data.code != 0) {
  101 |   const message = res.data.msg || `Api Error：code - ${res.data.code}`
> 102 |   const error = new Error(message)
      | ^  103 |   ;(error as any).response = res
  104 |   ;(error as any).config = res.config
  105 |   ;(error as any).response = res
View compiled
This screen is visible only in development. It will not appear if the app crashes in production.
Open your browser’s developer console to further inspect this error.  Click the 'X' or hit ESC to dismiss this message.

当出现 api 错误并通过窗口上的事件“unhandledrejection”捕获该错误时，我会抛出错误。但是在反应应用程序中，有一个如图所示的开发错误提示面板。我怎样才能禁用它，我不需要它。

Answer 1

您可以使用react-app-rewired调整CRA配置 https://github.com/timarney/react-app-rewired

这是你的config-overrides.js文件

module.exports = (config) => {
  const refreshPlugin = config.plugins.find((plugin) => plugin?.constructor?.name === 'ReactRefreshPlugin')

  if (refreshPlugin) {
    refreshPlugin.options.overlay = false
  }

  return config
}