How to fix regeneratorRuntime error async method with babel 7.5 + runtime + plugin-transform-runtime - npm

Question

I try to use async/await on a js script (class method) in a webpack config but i have got this error :
search.js:33 Uncaught ReferenceError: regeneratorRuntime is not defined
I have maybe an error in the babelrc file but i tried all things found on the web :/
Stack : WSL1 node 10.16.3 npm 6.11.1 in Visual Studio Code.
Previously, i had polyfill config with a similar problem.
I tried to use new Babel recommandations with #babel/plugin-transform-runtime and #babel/runtime but the issue persists.
I tried to remove /node_modules/ directory and lock package files to generate it again with npm i but nothing changes.
I have no problem with an async function declaration (outside a class).
File with generated error
class Search {
constructor() {...}
async run() {
await this.xxxx();
}
xxxx() {...}
}
.babelrc
{
"presets": [
["#babel/preset-env"],
[
"#babel/env",
{
"modules": false,
"useBuiltIns": "usage",
"corejs": 3
}
]
],
"plugins": [
[ "#babel/plugin-transform-runtime", {"regenerator": true, "corejs": 3} ],
[ "#babel/plugin-transform-async-to-generator" ]
]
}
package.json
{
...
"devDependencies": {
"#babel/core": "^7.5.5",
"#babel/plugin-syntax-dynamic-import": "^7.2.0",
"#babel/plugin-transform-async-to-generator": "^7.5.0",
"#babel/plugin-transform-runtime": "^7.6.2",
"#babel/preset-env": "^7.6.3",
"autoprefixer": "^9.6.1",
"babel-loader": "^8.0.6",
"clean-webpack-plugin": "^2.0.2",
"css-loader": "^2.1.1",
"file-loader": "^3.0.1",
"fontmin-webpack": "^2.0.4",
"imagemin-gifsicle": "^6.0.1",
"imagemin-jpegtran": "^6.0.0",
"imagemin-optipng": "^7.0.0",
"imagemin-svgo": "^7.0.0",
"imagemin-webpack": "^5.1.0",
"jquery": "^3.4.1",
"loader": "^2.1.1",
"mini-css-extract-plugin": "^0.5.0",
"node-sass": "^4.12.0",
"optimize-css-assets-webpack-plugin": "^5.0.3",
"postcss-cli": "^6.1.2",
"postcss-import": "^12.0.1",
"postcss-loader": "^3.0.0",
"postcss-preset-env": "^6.7.0",
"sass-loader": "^7.3.1",
"style": "0.0.3",
"style-loader": "^0.23.1",
"sugarss": "^2.0.0",
"uglifyjs-webpack-plugin": "^2.2.0",
"webpack": "^4.39.2",
"webpack-cli": "^3.3.7",
"webpack-manifest-plugin": "^2.0.4"
},
"dependencies": {
"#babel/runtime": "^7.6.3",
"core-js": "^3.3.2",
"detect-it": "^3.0.5",
"gifsicle": "^4.0.1",
"slick-carousel": "^1.8.1"
},
"browserslist": [
"last 2 versions"
]
}

Answer 1

I found the solution.
In the main js file
import "regenerator-runtime/runtime";
Add regenerator-runtime
npm i regenerator-runtime
Thanks.