Supporting Local Development with environment variables to combine with EAS builds

Hi Everyone,

I have read Environment variables in Expo - Expo Documentation and Environment variables and secrets - Expo Documentation and attempted to find a way to make this work with no luck (and I have tried many different ways)

Now EAS builds can use secrets so allowing us to store them and them be available on builds processed by EAS. I need a way to handle it locally when running expo start and developing the app so everything still works.

I have tried dot-env and react-native-dotenv and any which way so I can have local secrets but nothing is working. Im not sure if these work with expo or Im doing something wrong but nothing I try will get it to work.

I really wanted react-native-dotenv to work because then you could leverage process.env.my_var_name in the app and it will exist if local or built by EAS but this is just not working. Which seems the most ideal solution, but even if I need to do something else thats fine.

Before I had hidden files that would not be committed to git but still could be referenced and used e.g. .firebase_config but this does not work now with EAS builds.

What is the recommended way? / What has everyone got to work?

This is my sticking point with upgraded from Classic Builds to EAS.

My Expo version is 44.

hey there! those libraries do work but possibly they were misconfigured in your project? or possibly you needed to just clear the babel cache? (expo start --clear)

my personal preference is to use direnv to manage environment variables for a project in an .envrc file. we do this in the expo repository, for example. once you set that up to load environment variables into your shell, you’ll need to still use something like babel-plugin-transform-inline-environment-variables to actually inline them into your app source code at build time.

i went ahead and updated the docs pages to try to make them more clear, let me know if it’s helpful at all. Environment variables in Expo - Expo Documentation

Thanks @brents

Im pretty sure I configured things correctly following all the documentation, but you never know so i’ll have another look. I have tried (expo start --clear) but no change on loading the environment variables.

I have not heard of direnv so I will take a look at that next, sounds like a good solution to me, will have a go and reply back if I have a solution to the problem.

Thanks for the help.

Hey I’m the maintainer of react-native-dotenv . The library is built off babel-plugin-transform-inline-environment-variables with some extra magic to use dotenv-flow strategies. Are you using a babel json or js?

1 Like

Im not too sure why I could not get it to work I was using babel and think I had it setup correctly but clearly not and missed something somewhere. I think I loaded the plugin without including any env vars (which I think should work). But now Im explicitly including them so Im not sure if that was the problem.

I had installed the package, created a .env file with the environment variables I needed, loaded the react-native-dotenv plugin in my babel.config.js and then also babel-plugin-transform-inline-environment-variables but clearly I must have missed one point somewhere. I wanted process.env.{VAR_NAME} and I don’t think react-native-dotenv allows for that based on the documentation as it’s more importing the Variables you need. Where I wanted to match what EAS builds were doing.

I have now moved to using @brents solution which I have managed to get working and hitting the goals that I wanted, I think I prefer this solution because it means I don’t need to include any extra code in the project to handle this as it’s loaded by the shell . As it’s only for local purposes via expo start now EAS is loading them via secrets it all works the same and reduces the code I needed to handle this.

1 Like