blitz-js / babel-plugin-superjson-next

Automatically transform your Next.js Pages to use SuperJSON
MIT License
125 stars 15 forks source link

ReferenceError: _asyncToGenerator is not defined when using async handlers #33

Closed samuelgoldenbaum closed 3 years ago

samuelgoldenbaum commented 3 years ago

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>
    )

.babelrc:

{
  "presets": [
    "next/babel"
  ],
  "plugins": [
    "superjson-next"
  ]
}

Demo repo

samuelgoldenbaum commented 3 years ago

Updated to the latest version (0.1.10) of babel-plugin-superjson-next and seems fine.