Babel - regeneratorRuntime is not defined, when using transform-async-to-generator plugin
Solution 1
The latest documentation here is pretty clear: https://babeljs.io/docs/en/next/babel-plugin-transform-runtime
What worked for me is installing the two packages for build and for runtime (the final script for the browser):
npm install --save-dev @babel/plugin-transform-runtime
npm install --save @babel/runtime
In the plugin Array of my webpack configuration I just added '@babel/plugin-transform-runtime' without any options. (Please also have a look at the documentation linked above, since some options (that you might find in older tutorials or answers) have been removed.)
plugins: [
'@babel/plugin-transform-runtime'
]
I now can use async functions without errors, and it didn't add much code in the production build.
Solution 2
You also need the transform-runtime
plugin, so your .babelrc should ready:
{
"presets": [[
"@babel/env",
{"modules": false}
]],
"plugins": [
"syntax-dynamic-import",
"transform-runtime",
"transform-async-to-generator"
]
}
Note that you'll also need to npm install --save-dev transform-runtime
dendog
Updated on September 17, 2020Comments
-
dendog over 3 years
I am not able to setup babel correctly for the usage of async / await.
I am using babel 7 and webpack 4.
I do not want to use babel-polyfill if possible!
My babelrc file:
{ "presets": [[ "@babel/env", {"modules": false} ]], "plugins": [ "syntax-dynamic-import", "transform-async-to-generator" ] }
Code:
async function init() { const loaderData = await initLoader(); initCmp(loaderData) .then(initApi(loaderData.key)) .catch(); } init();
And Error:
refactor.main.js:18 Uncaught ReferenceError: regeneratorRuntime is not defined at eval (refactor.main.js:18) at eval (refactor.main.js:47) at Object../client/refactor.main.js (cmp.bundle.js:312) at __webpack_require__ (cmp.bundle.js:62) at eval (main.js:6) at Object../client/main.js (cmp.bundle.js:300) at __webpack_require__ (cmp.bundle.js:62) at cmp.bundle.js:179 at cmp.bundle.js:182
-
Thomas Fauskanger almost 6 yearsI needed to do
npm install -D babel-plugin-transform-runtime
, where the difference is the added prefixbabel-plugin-
. Without it I got an error that said ReferenceError: Unknown plugin "transform-runtime" when adding the"transform-runtime"
-plugin. -
Batman about 5 yearsWhen I use this I get an error saying
require is not defined
-
Dan over 4 years@makkabi can you explain why you install
@babel/plugin[...]
in dev and@babel/runtime
not? -
makkabi over 4 years@Daniel I followed the docs I linked to above, there is more explaination. As far as I understand, plugin-transform-runtime is used for transpiling the code on build time, so it is only a development dependency and not needed for running the transpiled code.
-
Adrián E. over 3 yearsI had the same problem in a project with typescript,
esm
modules and jest. I put this 'plugins' array insidebabel.config.json
and it worked. -
Ari Pratomo over 2 yearsthank, this also work in rollup config