reactjs - 如何禁用显示 'Unhandled Rejection (Error):XXXXX' 的 react 开发错误面板？

Question

Unhandled Rejection (Error)

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”捕获它。但是在 React 应用程序中，有一个开发错误提示面板，如图所示。我怎样才能禁用它，我不需要它。

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
}