.env variable not getting updated, probably cached

[AnshulRaghav]

• [ ] Asked question in discussions
• [x] Tried the troubleshooting Wiki
• [x] Followed the migration Wiki
• [x] Installed library as devDependency not production dependency

Describe the bug Suddenly the values in .env files are not getting updated. It was working fine earlier. I'm using gulp to change between multiple environments.

package.json

{
  "scripts": {
    "start": "gulp set --env=stag && react-native start --reset-cache",
    "format": "prettier --write '**/*.{js,jsx,json}'",
    "lint": "eslint src --ext .js,.jsx,.ts,.tsx --fix",
    "ci": "rm -fr node_modules && yarn install --frozen-lockfile",
    "jetify": "npx jetify",
    "patch": "patch-package",
    "postinstall": "npm-run-all -s patch jetify"
  },
  "dependencies": {
    "@gorhom/bottom-sheet": "4",
    "@react-native-async-storage/async-storage": "^1.23.1",
    "@react-native-community/eslint-config": "3.2.0",
    "@react-native-community/netinfo": "^11.3.0",
    "@react-native-picker/picker": "^2.6.1",
    "@react-native/gradle-plugin": "^0.74.84",
    "@react-navigation/material-top-tabs": "6.6.2",
    "@react-navigation/native": "6.1.6",
    "@react-navigation/stack": "6.3.16",
    "@typescript-eslint/eslint-plugin": "5.54.1",
    "@typescript-eslint/parser": "5.54.1",
    "axios": "0.27.2",
    "deprecated-react-native-prop-types": "4.0.0",
    "expo": "^51.0.14",
    "expo-av": "^14.0.5",
    "expo-font": "^12.0.7",
    "expo-secure-store": "^13.0.1",
    "expo-splash-screen": "^0.27.5",
    "expo-status-bar": "^1.12.1",
    "expo-web-browser": "^13.0.3",
    "gulp": "4.0.2",
    "gulp-clean": "0.4.0",
    "gulp-rename": "2.0.0",
    "npm-run-all": "4.1.5",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-native": "0.74.2",
    "react-native-gesture-handler": "^2.17.1",
    "react-native-logs": "5.0.1",
    "react-native-safe-area-context": "^4.10.5",
    "react-native-screens": "^3.32.0",
    "react-redux": "8.0.5",
    "redux": "4.2.1",
  },
  "devDependencies": {
    "@babel/core": "7.21.8",
    "@babel/plugin-transform-private-methods": "^7.24.7",
    "@babel/preset-env": "7.21.5",
    "@babel/runtime": "7.21.5",
    "@react-native-community/eslint-config": "3.2.0",
    "@react-native/metro-config": "0.74.84",
    "@react-native/typescript-config": "0.74.84",
    "@tsconfig/react-native": "3.0.0",
    "@types/react": "18.2.6",
    "@types/react-native": "0.71.6",
    "@types/react-native-sqlite-storage": "^6.0.5",
    "@types/react-test-renderer": "18.0.0",
    "babel-plugin-module-resolver": "5.0.0",
    "babel-preset-expo": "9.3.2",
    "eslint": "8.40.0",
    "eslint-config-prettier": "8.8.0",
    "eslint-plugin-import": "2.27.5",
    "eslint-plugin-jsx-a11y": "6.7.1",
    "eslint-plugin-react": "7.32.2",
    "eslint-plugin-react-hooks": "4.6.0",
    "eslint-plugin-react-native": "4.0.0",
    "husky": "8.0.3",
    "jetifier": "2.0.0",
    "lint-staged": "13.2.2",
    "metro-react-native-babel-preset": "0.76.3",
    "patch-package": "6.5.1",
    "pre-commit": "1.2.2",
    "prettier": "2.8.8",
    "react-native-dotenv": "3.4.8",
    "react-test-renderer": "18.2.0",
    "reactotron-react-native": "5.0.3",
    "reactotron-redux": "3.1.3",
    "typescript": "5.0.4"
  },
  "engines": {
    "node": ">=18"
  }
}

babel.config.js

module.exports = function (api) {
  api.cache(true);

  const aliases = {
    '@screens': './src/screens',
    '@utils': './src/utils',
    '@network': './network',
    '@theme': './src/Theme.js',
    '@config': './src/config',
    '@constants': './src/constants',
    '@components': './src/Components',
  };

  return {
    presets: ['babel-preset-expo'],
    plugins: [
      ['module-resolver', { alias: aliases, extensions: ['.ts', '.js', '.tsx'] }],
      ['@babel/plugin-proposal-decorators', { legacy: true }],
      ['@babel/plugin-transform-private-methods', { loose: true }],
      ['react-native-reanimated/plugin'],
      [
        'module:react-native-dotenv',
        {
          moduleName: '@env',
          path: '.env',
          allowUndefined: true,
        },
      ],
    ],
  };
};

Simulator: iphone 15, ios 17.4

I've tried various methods:

1. api.cache(true);
2. resetting the cache
3. deleting node_modules
4. rebuilding app
5. uninstalling and installing back again

Even deleted .env file but it doesn't seem to have any impact and was working fine.

[github-actions[bot]]

Hey, thank you for opening this issue! 🙂 To boost priority on this issue and support open source please tip the team at https://issuehunt.io/r/goatandsheep/react-native-dotenv/issues/508

[ShivangMishra]

Same issue here

[arnabJ]

While starting the server, via yarn, add "--reset-cache" to clear the cache. This helped me in getting the correct env.

My use case: I have two different .env files - One for development and one for production. I have two scripts to start the RN server each with different env file but it was taking always taking with the one I started.

Reseting the cache while starting the server helped me.

The full command: yarn start --reset-cache or, yarn start:prod --reset-cache

package.json scripts: { ... "start": "APP_ENV=dev react-native start", "start:prod": "APP_ENV=prod react-native start", ... }

Env files: .env.dev .env.prod