Sometimes, we may run into the ‘Await is a reserved word error inside async function’ error when developing a React app.

In this article, we’ll look at how to fix the ‘Await is a reserved word error inside async function’ error when developing a React app.

Fix the ‘Await is a reserved word error inside async function’ Error When Developing a React App

To fix the ‘Await is a reserved word error inside async function’ error when developing a React app, we should make sure we make any function that uses the await keyword an async function.

For instance, instead of writing:

export const sendVerificationEmail = async () =>
  (dispatch) => {
    try {
      dispatch({ type: EMAIL_FETCHING, payload: true });
      await Auth.sendEmailVerification();
      dispatch({ type: EMAIL_FETCHING, payload: false }))
    } catch (error) {
      dispatch({ type: EMAIL_FETCHING, payload: false });
      throw new Error(error);
    }
  };

We write:

export const sendVerificationEmail = async () =>
  async (dispatch) => {
    try {
      dispatch({ type: EMAIL_FETCHING, payload: true });
      await Auth.sendEmailVerification();
      dispatch({ type: EMAIL_FETCHING, payload: false }))
    } catch (error) {
      dispatch({ type: EMAIL_FETCHING, payload: false });
      throw new Error(error);
    }
  };

We add the async keyword to the function we returned in the sendVerificationEmail function.

Conclusion

To fix the ‘Await is a reserved word error inside async function’ error when developing a React app, we should make sure we make any function that uses the await keyword an async function.