I have been trying to get my API key from my .env file that is at the root of my folder of my Vite app to a JSX file where I want to do the fetching, but each time I use process.env.{MY_VARIABLE_NAME} the browser console returns an error:
ReferenceError: process is not defined
The line where I am trying to get data from the API:
const api = await axios.get(`https://api.spoonacular.com/recipes/random?apikey=${process.env.RECIPE_API_KEY}`)I checked around and I have tried installing dotenv and it still not works
Can anyone help with this, and if there is any more information that will be needed, I am available to provide it.
After doing some research, I found out that, since I am using a Vite React app, to access the variables in the .env file import.meta.env.{MY_VARIABLE_NAME} should be used instead of process.env.
And my I have to add a VITE_ prefix to the start of the variable name in both my .env file and where I am trying to access the API key.