Unable to run code in react yahoo finance 2 package

I'm building a react(tsx) app using Vite. My app gets stock-related info from Yahoo using yahoo-finance2 package.

When I'm running as a standalone js file, it is working as expected. But, when I use the same in react, I get an error as Uncaught ReferenceError: process is not defined. Here is my code.

import { useEffect, useState } from "react";
import "./index.css";
import yahooFinance from "yahoo-finance2";

function App() {
  const [isLoading, setIsLoading] = useState(false);

  useEffect(() => {
    const getQuote = async () => {
      setIsLoading(true);
      try {
        const response = await yahooFinance.quote("TSLA");
        console.log(response);
      } catch (err) {
        console.error(err);
      }
      setIsLoading(false);
    };

    getQuote();
  }, []);

  return (
    <div className="flex w-full h-screen justify-center items-center">
      <div className="text-lg">{isLoading ? `Loading...` : `Hello world!`}</div>
    </div>
  );
}

export default App;

Can someone please let me know where I'm going wrong? Here is my repo, if helpful. Thanks!

This is not exactly an answer, but after looking at many options I believe I found a much better source for the information you need. The API is very well documented. Here is the code I use to access quotes from alphavantage.co.

async function updateExchangeRate() {
    fetch('https://www.alphavantage.co/query?function=TIME_SERIES_INTRADAY&symbol=IBM&interval=5min&apikey=demo')
        .then((response) => {
            return response.json()
        })
        .then((data) => {
            console.log(data)
        })
}

It was trivial to instantaneously get an apikey (to replace "demo" in the url above).