为了解决这个问题，我使用了react-native中内置的__DEV__ polyfill。只要您不是为生产构建react native，它就会自动设置为true。

例如:

//vars.js

let url, publicKey;
if (__DEV__) {
  url = ...
  publicKey = ...
} else {
  url = ...
  publicKey = ...
}

export {url, publicKey}

然后只需导入{url}从'../vars'，你总是会得到正确的。不幸的是，如果你想要两个以上的环境，这就行不通了，但它很简单，而且不需要向你的项目添加更多的依赖项。

@chapinkapa的回答很好。由于Mobile Center不支持环境变量，我采取的一种方法是通过本地模块公开构建配置:

在android上:

   @Override
    public Map<String, Object> getConstants() {
        final Map<String, Object> constants = new HashMap<>();
        String buildConfig = BuildConfig.BUILD_TYPE.toLowerCase();
        constants.put("ENVIRONMENT", buildConfig);
        return constants;
    } 

或者在ios上:

  override func constantsToExport() -> [String: Any]! {
    // debug/ staging / release
    // on android, I can tell the build config used, but here I use bundle name
    let STAGING = "staging"
    let DEBUG = "debug"

    var environment = "release"
    if let bundleIdentifier: String = Bundle.main.bundleIdentifier {
      if (bundleIdentifier.lowercased().hasSuffix(STAGING)) {
        environment = STAGING
      } else if (bundleIdentifier.lowercased().hasSuffix(DEBUG)){
        environment = DEBUG
      }
    }

    return ["ENVIRONMENT": environment]
  }

您可以同步读取构建配置，并在Javascript中决定如何执行。

步骤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

我已经为相同的问题创建了一个预构建脚本，因为我需要一些不同环境的不同API端点

const fs = require('fs')

let endPoint

if (process.env.MY_ENV === 'dev') {
  endPoint = 'http://my-api-dev/api/v1'
} else if (process.env.MY_ENV === 'test') {
  endPoint = 'http://127.0.0.1:7001'
} else {
  endPoint = 'http://my-api-pro/api/v1'
}

let template = `
export default {
  API_URL: '${endPoint}',
  DEVICE_FINGERPRINT: Math.random().toString(36).slice(2)
}
`

fs.writeFile('./src/constants/config.js', template, function (err) {
  if (err) {
    return console.log(err)
  }

  console.log('Configuration file has generated')
})

我已经创建了一个自定义的npm运行脚本来执行反应本机运行..

我package-json

"scripts": {
    "start-ios": "node config-generator.js && react-native run-ios",
    "build-ios": "node config-generator.js && react-native run-ios --configuration Release",
    "start-android": "node config-generator.js && react-native run-android",
    "build-android": "node config-generator.js && cd android/ && ./gradlew assembleRelease",
    ...
}

然后在我的服务组件中导入自动生成的文件:

import config from '../constants/config'

fetch(`${config.API_URL}/login`, params)

用于设置环境变量的具体方法将因您使用的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)管理文件的编写方式，以更好地控制在构建时如何生成配置。

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