https://github.com/yayapao/react-error-catcher

A powerful error catcher in React!
https://github.com/yayapao/react-error-catcher

Last synced: 12 days ago
JSON representation

A powerful error catcher in React!

• Host: GitHub
• URL: https://github.com/yayapao/react-error-catcher
• Owner: yayapao
• License: mit
• Created: 2020-09-02T06:24:56.000Z (about 4 years ago)
• Default Branch: master
• Last Pushed: 2021-04-29T10:19:53.000Z (over 3 years ago)
• Last Synced: 2024-04-23T05:27:00.996Z (7 months ago)
• Language: JavaScript
• Size: 2.82 MB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
English | [简体中文](./README.zh-CN.md)

# React Error Catcher 🍑

This is a powerful **React** error catcher!

It can catch these below:

- React component render error, use [Error Bounary](https://zh-hans.reactjs.org/docs/error-boundaries.html)

- Event error, use [onError](https://developer.mozilla.org/zh-CN/docs/Web/API/ErrorEvent)

- Promise error, use [PromiseRejectionEvent](https://developer.mozilla.org/zh-CN/docs/Web/API/PromiseRejectionEvent)

When error catched, you will get a list of errors by **onCatch** event

As we all konw, sometime errors can be too much to handle, so i filter the mutiple errors, also i support the **filters** for you to define which error can be ignored!

### Install 

Run `npm install react-error-catcher` or `yarn add react-error-catcher` to install it

Then you can use it in your project like this:

```javascript

import ErrorCatcher from 'react-error-catcher'

const App = () => {

  return (

    

    )

}

export default App

```

## Props

| properity   | description                                                  | type                        | default                         |

| ----------- | ------------------------------------------------------------ | --------------------------- | ------------------------------- |

| errorRender | when an error occurs in component rendering, decide which lower layer component to display | React.ReactNode             | \
Something went wrong\
 |

| user        | who cause the error                                          | string                      | "unkonwn user"                  |

| app         | error occurs in which app                                    | string                      | "unkonwn app"                   |

| max         | when the catched errors exceeds the max value,  trigger the callback method | number                      | 1                               |

| delay       | report error interval, unit is millisecond                   | number                      | 60000                           |

| filters     | define the errors which can be ignored                       | string[]                    | -                               |

| onCatch     | callback when catching errors and achieving the trigger cases | (error: ErrorInfo[]) => any | -                               |


## About

If you want to develop a npm library, you can see [npm-template](https://github.com/Y-lonelY/npm-template), welecome to star and fork!