我正在使用react-native来构建一个跨平台的应用程序,但我不知道如何设置环境变量,以便我可以有不同的常量为不同的环境。

例子:

development: 
  BASE_URL: '',
  API_KEY: '',
staging: 
  BASE_URL: '',
  API_KEY: '',
production:
  BASE_URL: '',
  API_KEY: '',

当前回答

对于最新的RN版本,您可以使用这个本机模块:https://github.com/luggit/react-native-config

其他回答

我认为像下面这样的库可以帮助您解决谜题中缺失的部分,即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

可以使用process.env.blabla而不是process.env['blabla']访问变量。我最近让它工作,并评论了我是如何在GitHub上的一个问题上做到这一点的,因为我有一些基于公认答案的缓存问题。问题是这样的。

我使用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文件时遇到了一些问题。

步骤1:像这样创建单独的组件 组件名称:pagebase.js 步骤2:在此使用代码this

    export const BASE_URL = "http://192.168.10.10:4848/";
    export const API_KEY = 'key_token';

步骤3:在任何组件中使用它,要使用它,首先导入这个组件,然后使用它。 导入并使用它:

        import * as base from "./pagebase";

        base.BASE_URL
        base.API_KEY

用于设置环境变量的具体方法将因您使用的CI服务、构建方法、平台和工具而异。

如果你正在使用Buddybuild for CI来构建应用程序和管理环境变量,并且你需要从JS中访问配置,创建一个带有键(空字符串值)的env.js.example用于签入源代码控制,并在构建时在后克隆步骤中使用Buddybuild生成一个env.js文件,从构建日志中隐藏文件内容,如下所示:

#!/usr/bin/env bash

ENVJS_FILE="$BUDDYBUILD_WORKSPACE/env.js"

# Echo what's happening to the build logs
echo Creating environment config file

# Create `env.js` file in project root
touch $ENVJS_FILE

# Write environment config to file, hiding from build logs
tee $ENVJS_FILE > /dev/null <<EOF
module.exports = {
  AUTH0_CLIENT_ID: '$AUTH0_CLIENT_ID',
  AUTH0_DOMAIN: '$AUTH0_DOMAIN'
}
EOF

提示:不要忘记将env.js添加到.gitignore中,这样在开发过程中配置和秘密就不会意外地检入源代码控制。

然后,您可以使用Buddybuild变量(例如buddybuild_variables)管理文件的编写方式,以更好地控制在构建时如何生成配置。