How to use .env files in ionic with React JS

Ionic Framework Ionic React
1

Urgent help required i wants to add some secret keys in my frontend for packages to work.
but i am not able to use .env files I tried many solutions but they didn’t worked.

I made a new file .env and add an variable

REACT_APP_SITE_KEY = “your site key”

i am using it in one of my components like announcement component like this

console.log (process.env.REACT_APP_SITE_KEY)

it is giving me error !

‘process is not defined’.

please help me in this
I am using ionic v 7.1.1

2

You can use prefix “VITE” instead of “REACT_APP” in the .env file

VITE_SITE_KEY="Your site key"

and use it like this anywhere in the project

console.log(import.meta.env.VITE_SITE_KEY)

after applying changes on .env file, run

ionic serve
3

Thank you so much Sir.
It worked

1 Like