Why my app breaks when building it with eas?

Question

I just finished this app, when i run it whit expo start, it all seems to work fine, nothing crashes and everything looks great, but when i build the app with eas build or eas build --profile=x the app builds into an apk, it finish without errors, but when i install the apk and run the app i only see a white screen, and i don't know what is happening.

Here is my eas.json:

{
    "cli": {
      "version": ">= 0.44.0"
    },
    "build": {
      "development": {
        "developmentClient": true,
        "distribution": "internal",
        "android": {
          "buildType": "apk"
        },
        "env": {
          "APIKEY": "",
          "AUTHDOMAIN": "",
          "PROJECTID": "",
          "STORAGEBUCKET": "",
          "MESSAGINGSENDERID": "",
          "APPID": "",
          "MEASUREMENTID": ""
        }
      },
      "preview": {
        "distribution": "internal",
        "android": {
          "buildType": "apk"
        },
        "env": {
          "APIKEY": "",
          "AUTHDOMAIN": "",
          "PROJECTID": "",
          "STORAGEBUCKET": "",
          "MESSAGINGSENDERID": "",
          "APPID": "",
          "MEASUREMENTID": ""
        }
      },
      "production": {
        "android": {
          "buildType": "apk"
        },
        "env": {
          "APIKEY": "",
          "AUTHDOMAIN": "",
          "PROJECTID": "",
          "STORAGEBUCKET": "",
          "MESSAGINGSENDERID": "",
          "APPID": "",
          "MEASUREMENTID": ""
        }
      }
    },
    "submit": {
      "production": {}
    }
  }

I'm also using firebase so i'm using those environment variables, i have a .env file and also this on the eas.json file, my hypotesis is that maybe the firebaseApp is not initializing but i think the app is supposed to crash then, doesn't it? The app doesn't close when this happens it only appears a white screen with nothing in it.

Here is the repository of the project: https://github.com/david1opez/MercadoTec

Answer 1

What works for me is using a doting file (https://docs.expo.dev/guides/environment-variables/)

1. Create a .env file with your firebase keys:

API_KEY=YourApiKey,
AUTH_DOMAIN=your-auth.domain.com
...

2. Install babel-plugin-inline-dotenv. This will load your.env file (https://github.com/brysgo/babel-plugin-inline-dotenv)

3. Your firebaseConfig should look like this:

firebaseConfig = {
  apiKey: process.env.API_KEY,
  ...
}

4. Your Babel config should look like this:

module.exports = function (api) {
 api.cache(true);
 return {
   presets: ['babel-preset-expo'],
   plugins: ['inline-dotenv'],
 };
};

5. Your eas.json should look like this:

{
  "cli": {...}
  "build": {
    "development": {...},
    "preview": {...},
    "production": {
      "env": {
        "API_KEY":"YourApiKey",
        ...
      }
    }
  },
  "submit": {
    "production": {...}
  }
}