DEPRECATED: This feature was already implemented on the original source since v3.0.0, so please use from https://github.com/doochik/babel-plugin-transform-react-ssr-try-catch instead, Sorry for the inconvenience!
Babel plugin to wrap render() method in React.Component with try-catch statement.
React 16 has error handling but for client rendering only.
This plugin performs simple transform which wraps render() method with try-catch.
Just make sure to put ERRORBOUNDARY_render() method in your Class-based components.
Example:
// MyComponent.js
class MyComponent extends React.PureComponent {
ERRORBOUNDARY_render() {
return <p>An error happened. Please try again later!</p>;
}
render() {
return <div />;
}
}That component will be transformed to:
// MyComponent.js
class MyComponent extends React.PureComponent {
render() {
try {
return this.__originalRenderMethod__();
} catch (e) {
return this.ERRORBOUNDARY_render(e, this.constructor.name);
}
}
ERRORBOUNDARY_render() {
return <p>An error happened. Please try again later!</p>;
}
__originalRenderMethod__() {
return <div />;
}
}Actually, this is a temporary solution until React has support error handling in SSR.
npm install --save-dev dwicao-babel-plugin-transform-react-ssr-try-catch.babelrc
{
"plugins": [
["dwicao-babel-plugin-transform-react-ssr-try-catch"]
]
}
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent