如果你正在使用expo(managed workflow)开发你的应用程序，你必须在你的项目的根目录中创建一个名为app.config.js的文件，并将以下代码添加到文件中:

const myValue = "My App";

export default () => {
    if (process.env.MY_ENVIRONMENT === "development") {
        return {
            name: myValue,
            version: "1.0.0",
            // All values in extra will be passed to your app.
            extra: {
                fact: "dogs are cool"
            }
        };
    } else {
        return {
            name: myValue,
            version: "1.0.0",
            // All values in extra will be passed to your app.
            extra: {
                fact: "kittens are cool"
            }
        };
    }
};

然后你应该使用下面的命令启动/发布你的应用程序(这在Windows中也适用)。对于其他操作系统，请阅读我在最后提到的文章)。

npx cross-env MY_ENVIRONMENT=开发博览会启动/发布

这将使用上面提到的环境变量(MY_ENVIRONMENT)启动或发布应用程序。应用程序将根据环境变量加载适当的配置。现在可以通过将名为exo -constants的模块导入到项目文件中，从配置中访问变量extra。例如:

import Constants from "expo-constants";

export default function App() {
    console.log(Constants.manifest.extra.fact);
    return (
        <>
            <View>
                <Text>Dummy</Text>
            </View>
        </>
    );
}

使用常数。Manifest我们可以额外访问里面的对象。因此，如果您的环境变量是development，这段代码应该console.log“dogs are cool”。我希望这对你有用。要了解更多信息，请阅读本文。

如果你使用的是Expo，根据文档https://docs.expo.io/guides/environment-variables/有两种方法

方法#1 -在应用程序清单(app.json)中使用.extra道具:

在你的app.json文件中

{
  expo: {
    "slug": "my-app",
    "name": "My App",
    "version": "0.10.0",
    "extra": {
      "myVariable": "foo"
    }
  }
}

然后要访问你的代码(即App.js)上的数据，只需导入expo-constants:

import Constants from 'expo-constants';

export const Sample = (props) => (
  <View>
    <Text>{Constants.manifest.extra.myVariable}</Text>
  </View>
);

这个选项是一个很好的内置选项，不需要安装任何其他包。

方法#2 -使用Babel“替换”变量。这是您可能需要的方法，特别是当您正在使用裸工作流时。其他的答案已经提到了如何使用babel-plugin-transform-inline-environment-variables来实现它，但是我将在这里留下一个官方文档的链接来说明如何实现它:https://docs.expo.io/guides/environment-variables/#using-babel-to-replace-variables

[来源]从我的发现来看，默认情况下，它只可能做生产和开发配置(没有登台或其他环境)-对吗?

现在，我一直在使用一个environment.js文件，可以用来检测博览会发布通道，并根据此更改返回的变量，但对于构建，我需要更新返回的非DEV变量为staging或prod:

import { Constants } from 'expo';
import { Platform } from 'react-native';
const localhost = Platform.OS === 'ios' ? 'http://localhost:4000/' : 'http://10.0.2.2:4000/';
const ENV = {
  dev: {
    apiUrl: localhost,
  },
  staging: {
    apiUrl: 'https://your-staging-api-url-here.com/'
  },
  prod: {
    apiUrl: 'https://your-prod-api-url-here.com/'
  },
}
const getEnvVars = (env = Constants.manifest.releaseChannel) => {
  // What is __DEV__ ?
  // This variable is set to true when react-native is running in Dev mode.
  // __DEV__ is true when run locally, but false when published.
  if (__DEV__) {
    return ENV.dev;
  } else {
    // When publishing to production, change this to `ENV.prod` before running an `expo build`
    return ENV.staging;
  }
}
export default getEnvVars;

选择

谁有在用expo构建的项目中使用react-native-dotenv的经验?我很想听听你的想法

https://github.com/goatandsheep/react-native-dotenv

我认为像下面这样的库可以帮助您解决谜题中缺失的部分，即getPlatform()函数。

https://github.com/joeferraro/react-native-env

const EnvironmentManager = require('react-native-env');

// read an environment variable from React Native
EnvironmentManager.get('SOME_VARIABLE')
  .then(val => {
    console.log('value of SOME_VARIABLE is: ', val);

  })
  .catch(err => {
    console.error('womp womp: ', err.message);
  });

我所看到的唯一问题是，这是异步代码。有一个拉请求来支持getSync。也来看看吧。

https://github.com/joeferraro/react-native-env/pull/9

我使用react-native-config为我的项目设置了多个环境。README文件非常清楚地解释了如何在项目中配置库。只要确保实现Android部分的额外步骤即可。

另外，在设置多个环境时，请确保在包中指定正确的启动命令。Json，基于您的系统终端。我在windows笔记本电脑中开发了Android代码，在Macbook中开发了iOS代码，所以我各自的启动命令都在包中。Json是-

"scripts": {
        "android:dev": "SET ENVFILE=.env.dev && react-native run-android",
        "android:prod": "SET ENVFILE=.env.prod && react-native run-android",
        "ios:dev": "ENVFILE=.env.dev react-native run-ios",
        "ios:prod": "ENVFILE=.env.prod react-native run-ios",
},

如果您只需要维护一个.env文件，请考虑使用 react-native-dotenv是一个较轻的选择，尽管我在为这个库设置多个.env文件时遇到了一些问题。

不要传递像VAR=value react-native run-android或VAR=value react-native run-ios这样的变量。这些变量只有当我们在开始命令中传递它们时才可以访问，即VAR=value react-native start——reset-cache。

你可以通过3个简单的步骤来实现这一点:-

通过运行npm i babel-plugin-transform-inline-environment-variables——save-dev安装babel-plugin-transform-inline-environment-variables。 在.bablerc或babel.config.js中添加"plugins": ["transform-inline-environment-variables"] 在启动metro bundle时传递变量，即VAR=value react-native start -reset-cache，不要在react-native run-android或react-native run-ios命令中传递这些变量。

请记住，使用——reset-cache标志是必需的，否则变量的变化将不会被应用。