How to fix regeneratorRuntime is not defined?

I have ran into a problem, the error is regeneratorRuntime is not defined while working with React and Parcel bundler.

The problem appeared after I added an async function and while searching the problem, I found a stack-overflow solution but it didn't work. So, don't use this method.

Solution

First, I found this solution:

• add import "babel-polyfill"; at the top of the file that you are using the async function.

BUT

• later learned that babel-polyfill is deprecated. So, to solve the regeneratorRuntime problem, do this:

• Install regenerator-runtime
  npm install --save regenerator-runtime

• Update webpack file
  entry: ["regenerator-runtime/runtime.js", "<your enter js file>"]

• require import 'regenerator-runtime/runtime' at the top of the file that you're using async function

I didn't edit webpack, because I'm using Parcel, but just importing regenerator-runtime/runtime at the top of the file solved the problem.

Resources

BABEL/ReferenceError regeneratorRuntime is not defined #9849