I am trying to build a react app and want to call a function like this:

if (typeof window !== 'undefined') { var token = (await getItem('secure_token')); }

if (typeof window !== 'undefined') { var user_id = (await getItem('user_id')); }

I am getting error that:

Module parse failed: The top-level-await experiment is not enabled (set experiments.topLevelAwait: true to enabled it)

How can I achieve that. because without await, I am getting [object Promise] and not the actual value.

Below is the complete code:

import axios from "axios";

import { getStorage } from "../../components/Helper";

const API_URL = "http://127.0.0.1:8000/api";

const BASE_API = "http://127.0.0.1:8000";

var token = null;

var user_id = null;

if (typeof window !== 'undefined') { var token = (await getItem('secure_token')); }

if (typeof window !== 'undefined') { var user_id = (await getItem('user_id')); }

export const API_ROUTE = axios.create({

    baseURL: API_URL,

    withCredentials: true,

    crossdomain: true,

    headers: {

        "Key": token,

        "Id": user_id

    }

});



export const csrf_token = async () => {

    await axios.get(BASE_API + '/sanctum/csrf-cookie');

}



async function getItem(item) {

    var data = await getStorage(item);

    return data;

}