Environment Variables in Vite + React

[@sabinsunny655]

I have been scratching my head around this whole day, finally this helped, thankyou very much, I appreciate the good work , keep going , and thank you very much

[@LordFullStack]

Do subscribe , will mean a lot to me. Thanks

[@ChoaibElmadi]

@@LordFullStack Thanks a lot brother !!! I'm definitly subscribing

[@edisonarchives]

I searched for this for hours. Thanks brother!

[@LordFullStack]

Glad I could help

[@pancho_mtl]

X2 😂

[@hemantsinghparmar]

Thank you bro! Even bard and chatgpt were not able to solve this issue!!

[@elmokhtar8576]

Thank you so much, I was getting process is not defined and this video helped me out. New Subscriber

[@LordFullStack]

Glad it helped.

[@KitaTFT]

I get confused with this problem for 1 hour, Already amazing when I watched your video, I had resolved this problem in 1 minute. Thank you so much 🤗

[@LordFullStack]

Glad to hear that.🤩

[@dev_navarro]

Thank you very much, this video helped me SUPER. I saw many other videos, all super long and didn't give a functional answer, unlike yours, direct and functional. Congratulations, and hello from Brazil! (Sorry if the English is bad, it's 100% the translator)

[@LordFullStack]

Glad it helped! ( Your English is more than good 😉)

[@KaioFernando-y5l]

Finally found it! So straight to the point. Helped me a lot, thanks :)

[@zidanbadr1658]

thank you so much, you saved me before giving up, it was so close

[@LordFullStack]

Glad I could help!

[@LordFullStack]

Do subscribe , will mean a lot to me. Thanks

[@RUFeelin]

Thanks Lord - I was almost there but not quite. You got me over the line. Appreciate the helpful vid

[@BernhardRutzen]

Thanks mate! Your content is very concise and to the point!

[@LordFullStack]

🙏🏻🤩

[@likatest7718]

So i must add vite in front off my custom env variable?

[@LordFullStack]

Yes , VITE_

[@eu_giovannicrz]

Finally, after a long time searching. God bless u

[@losVamonos]

I want my apiKey to be imported this way so that my app can fetch some data using it but don’t want it exposed on the client side. How do I do this?

[@LordFullStack]

Put it in env and remove env file from git and add it to gitignore

[@losVamonos]

@@LordFullStack the key will still be exposed in the browser if you view source.

[@AdnanSami-jp1en]

did you find the solution to it?

[@LordFullStack]

Then you can use a reverse proxy, but there's always will be a visible source that will be exposed to the browser.

[@losVamonos]

@@AdnanSami-jp1en Yes, I created a proxy server that performs any fetching I need that requires the protection of the env var. Then from my app I make calls to it.

[@NamrathaSairam-e1h]

Even when you are running in local, it says development mode right. How to differentiate between local and development environment

[@LordFullStack]

SET ENV production in deployment

[@kprachana]

thank you! I was stuck for a long time

[@vnxcius]

THANK YOU SO MUCH THIS WAS DRIVING ME CRAZY!!!

[@LordFullStack]

No worries 👍🏻

[@romanmed9035]

vite do not support "import type {foo} from" i have error Expected "from" but found "{"

[@neeor10]

If this method still doesn’t work, make sure your .env file is in your root folder.

[@faruzzy]

Thanks I had this issue!

[@salma-amlas]

Don't forget everyone to put .env in your gitignore when you're done

[@lobato8668]

You are the best indian i know bro! i love you.

[@LordFullStack]

Thanks, really appreciate 🙏🏻 . Lots of love and blessings for you too man.❤️

[@mohitpardeshi]

Thanks yaar , but is chiz ko koi documentation hai?

[@LordFullStack]

Yes. github.com/bluwy/create-vite-extra

[@rupbhaiya]

Amazing brother, take love 😍

[@LordFullStack]

💖

[@salma-amlas]

I gave you a like. This is very helpful

[@LordFullStack]

Glad it helped

[@theodoro-tsx]

you're the best , thank you to solve this, I almost get crazy with this .env error

[@mdsamialbadhon1106]

Thanks a lot bro..💖💖 you helped me a lot

[@deepsankarde8397]

Thanks dude for the solution 🤝

[@LordFullStack]

Happy to help

[@donovangg]

I was so used to CRA and I was wondering what the hell I was doing wrong lmao. Thank you !!!!

[@LordFullStack]

Glad i could help. 🙂

[@abdurrahim-bj7nu]

Thanks, Lord really helpful video for me.

[@tailonramos7941]

thank you! this helped me a lot!

[@LordFullStack]

Glad it helped!

[@LordFullStack]

Do subscribe , will mean a lot to me. Thanks

[@taufikislam3187]

thank you bro . i was stuck in more than 3 hours . finally i got a solution

[@romanbush5164]

bullShit Uncaught TypeError: Cannot set properties of undefined (setting 'Popper') why this makes?

[@ashutosh887_]

How to add Env. Variables in vite.config.js

[@LordFullStack]

You can't.

[@tryingcodeeng]

thank you sir .. nice video

[@LordFullStack]

Most welcome

[@alialsalahi6581]

thank you , it was easy and helpfull

[@LordFullStack]

Glad it helped!

[@Utsav-hx6ug]

You r a saviour 😄

[@systemforge]

Dude! u r amazing... I fukin wasted hrs for this... Thankyou so much!!

[@nocturnetheatre3954]

thank you! this really helps.

[@hehebehello2080]

thanks man you got me out of real pickle lol

[@LordFullStack]

Glad I could help

[@fourchaite2585]

THANK U SO FCKING MUCH FOR THIS VID

[@LordFullStack]

Thank You so fuking Much for the comment. Lol 👌🏻😄

[@FaishalHanif]

Thank you, really helps

[@score_]

thank you so much bro, you just saved me!

[@LordFullStack]

You are welcome! 😄

[@LordFullStack]

Do subscribe , will mean a lot to me. Thanks

[@RomilJain-wt3lb]

nice vide

[@adeven2226]

thank you brother

[@LordFullStack]

Welcome

[@Sooraj-Rao6]

Thanks!!❤

[@LordFullStack]

You're welcome 😊

[@BRP-Moto-Tips]

Thanks kinggggg

[@LordFullStack]

Gald to help kingggg

[@WiFiWaLaaa]

Thanks bro ;)

[@LordFullStack]

Any time

[@ricky_cynical]

Thanks man

[@AvinashUchadiya]

Thanks

[@khateebanwer7466]

Thanks for the help :}

[@LordFullStack]

Happy to help

[@IcaroAugustoRodriguesdeFreitas]

Thank you man

[@LordFullStack]

Any time

[@Lafsha]

thank you so muchhh !!!!

[@LordFullStack]

You're welcome!

[@rahmanmuhaemin5300]

thankyou sir

[@GustavoMurilo107]

Nice!!

[@emsi1161]

Genio

[@ezaxom4067]

MY GOAT

[@hgizem]

Thank you :)

[@LordFullStack]

You're welcome!

[@LordFullStack]

Do subscribe , will mean a lot to me. Thanks

[@kacperkepinski4990]

cant hear anything

[@luizbrito9434]

i love you

[@LordFullStack]

Thanks, keep loving me 😜 JK.

[@arksincorporation]

this help alot

[@matteotholey3916]

Thanks !!!

[@def2easy942]

thanks man

[@dessianwar9206]

thanks !

[@avalojandro]

THANKS!!!!!!!!

[@alexlun4464]

extremely rare vite L

[@alexlun4464]

but the upside is that you no longer need to require dotenv and can use env variables straight out the box, the downside is that all your variables must now start with vite 💀

[@UsmanTanveer-h8s]

so JSON.stringify(import.meta.env.VITE_REACT_API_URL)

[@LordFullStack]

Stringify was just to render the json in react component. You can just use import.meta.env.VITE_**** in your javascript logic

[@anzoangelo4543]

thanks it worked like a charm

[@priyanshu6465]

Thanks man