```js import ErrorBoundary from '@invisionag/iris-react-errorboundary'; ```


3.5.23 months ago4 years agoMinified + gzip package size for @invisionag/iris-react-error-boundary in KB


import ErrorBoundary from '@invisionag/iris-react-errorboundary';

react-error-boundary is a component that catches JavaScript errors anywhere in its child component tree and displays a fallback UI instead. This prevents the entire react app from unmounting by using React 16's componentDidCatch lifecycle method.



Renders a fallback UI when <SomeComponent /> throws an error. (As seen in the default Story)

  <SomeComponent />


When using the default fallback UI the showStackTrace prop controlles if the stacktrace is shown. By default the stacktrace isn't shown in the production enviroment.

// Will never show the stacktrace
<ErrorBoundary showStackTrace={false}>
  <SomeComponent />


The renderError prop lets you render a custom fallback UI. It expects a function that takes an ErrorObject and returns a React Node.

type ErrorObject = {
  error: Error,
  componentStack: string,

renderError = (errorObject: ErrorObject) => (
  <SomeAlternateComponent errorObject={errorObject} />

<ErrorBoundary renderError={renderError}>
  <SomeComponent />

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.