Adding async to handlers causes the following error:
ReferenceError: _asyncToGenerator is not defined when using async handlers
The above error occurred in the <Page> component:
at Page (webpack-internal:///./pages/index.tsx:17:22)
at WithSuperJSON (webpack-internal:///./node_modules/babel-plugin-superjson-next/dist/tools.js:81:30)
at App (webpack-internal:///./node_modules/next/dist/pages/_app.js:76:5)
at ErrorBoundary (webpack-internal:///./node_modules/@next/react-dev-overlay/lib/internal/ErrorBoundary.js:23:47)
at ReactDevOverlay (webpack-internal:///./node_modules/@next/react-dev-overlay/lib/internal/ReactDevOverlay.js:73:23)
at Container (webpack-internal:///./node_modules/next/dist/client/index.js:151:5)
at AppContainer (webpack-internal:///./node_modules/next/dist/client/index.js:642:24)
at Root (webpack-internal:///./node_modules/next/dist/client/index.js:771:24)
React will try to recreate this component tree from scratch using the error boundary you provided, App.
Example:
const handleClick = async (e) => { // async here causes error to be thrown
console.info('hello');
}
return (
<Layout>
<button onClick={handleClick} type="button">Hello</button>
</Layout>
)
Adding async to handlers causes the following error:
Example:
.babelrc:
Demo repo