react-native-config 使用

• 源代码名称:react-native-config
• 源代码网址:http://www.github.com/luggit/react-native-config
• react-native-config源代码文档
• react-native-config源代码下载
• Git URL:

  复制代码

  git://www.github.com/luggit/react-native-config.git

  Git Clone代码到本地:

  复制代码

  git clone http://www.github.com/luggit/react-native-config

  Subversion代码到本地:

  复制代码

  $ svn co --depth empty http://www.github.com/luggit/react-native-config
  Checked out revision 1.
  $ cd repo
  $ svn up trunk
  

  用于响应本机应用程序的配置变量

  模块将配置变量公开到你的javascript代码中，同时支持iOS和 Android。

  带来一些 12因子，喜欢你的移动应用 ！

  用法

  创建一个新的文件 .env 在你的React本机应用程序的root 中：

  复制代码

  
  API_URL=https://myapi.com
  
  
  GOOGLE_MAPS_API_KEY=abcdefgh
  
  
  

  然后从你的应用程序中访问定义的变量：

  复制代码

  importConfigfrom'react-native-config'Config.API_URL// 'https://myapi.com'Config.GOOGLE_MAPS_API_KEY// 'abcdefgh'

  记住这个 MODULE 不会混淆或者加密打包密钥，因此不会在 .env 中存储敏感密钥。 基本上，阻止用户从移动应用软件中逆向工程是不可能的，所以设计你的应用程序( 和 api ) 是。

  Android

  .env 中设置的配置变量通过 BuildConfig 可以用于你的Java类：

  复制代码

  publicHttpURLConnection getApiClient() {
   URL url =newURL(BuildConfig.API_URL);
   //.. .}

  你还可以从Gradle配置中读取它们：

  复制代码

  defaultConfig {
   applicationId project.env.get("APP_ID")
  }

  使用它们来配置 AndroidManifest.xml 中的库和其他库：

  复制代码

  <meta-dataandroid:name="com.google.android.geo.API_KEY"android:value="@string/GOOGLE_MAPS_API_KEY"/>

  所有变量都是字符串，因此你可能需要将它们转换为。 例如在Gradle中：

  复制代码

  
  versionCode project.env.get("VERSION_CODE").toInteger()
  
  
  

  同样，记住存储在 .env 中的变量与代码一起发布，所以不会像你的应用程序那样放置任何敏感的东西。

  iOS

  从 Obj-C 类中读取在 .env 中声明的变量，例如：

  复制代码

  // import header#import"ReactNativeConfig.h"// then read individual keys like:NSString *apiUrl = [ReactNativeConfig envFor:@"API_URL"];// or just fetch the whole configNSDictionary *config = [ReactNativeConfig env];

  它们还可以在 Info.plist 中配置，通过将 __RN_CONFIG_ 设置为它的名称：

  复制代码

  
  __RN_CONFIG_API_URL
  
  
  

  注意：需要特定设置( 请参见下面)，并且在更改值以查看更新后的值之后需要一个 Product> Clean。

  不同的环境

  保存不同文件中不同环境的配置： .env.staging，.env.production 等。

  默认react-native-config将从 .env 读取，但你可以在构建或者发布应用程序时更改它。

  最简单的方法是告诉它要使用环境变量读取什么文件，例如：

  复制代码

  
  $ ENVFILE=.env.staging react-native run-ios # bash
  
  
  $ SET ENVFILE='.env.staging' && react-native run-ios # windows
  
  
  $ env:ENVFILE=".env.staging"; react-native run-ios # powershell
  
  
  

  这也适用于 run-android。 或者，下面有一些特定于平台的选项。

  Android

  可以使用相同的环境变量来组合具有不同配置的发行版：

  复制代码

  
  $ cd android && ENVFILE=.env.staging./gradlew assembleRelease
  
  
  

  或者，可以在 build.gradle 中定义与env文件关联的映射。 在 apply from 调用之前执行，并在 lowercase 中使用生成案例，例如：

  复制代码

  
  project.ext.envConfigFiles = [
  
  
   debug:".env.development",
  
  
   release:".env.production",
  
  
   anothercustombuild:".env",
  
  
  ]
  
  
  
  apply from: project(':react-native-config').projectDir.getPath() +"/dotenv.gradle"
  
  
  

  iOS

  iOS的基本思想是每个环境文件都有一个方案，所以你可以轻松地在它们之间进行替换。

  首先创建一个新方案：

  • 在Xcode菜单中，转到产品> 方案> 编辑方案
  • 单击底部的重复方案
  • 在左上角给它一个适当的NAME。 例如："myapp ( 回写)"

  然后编辑新创建的方案，使它的使用不同的env文件。 从同一个"管理方案"窗口中：

  • 展开左侧的"生成"设置
  • 单击"预操作"，并在加号下选择"新运行脚本 Action"
  • 其中显示"键入脚本或者拖动脚本文件"，键入：

    复制代码

    
    echo".env.staging">/tmp/envfile # replace. env.staging for your file
    
    
    

  这仍然有点实验和脏- 让我们知道如何使iOS使用不同的配置打开请求或者问题。

  设置

  安装软件包：

  复制代码

  
  $ yarn add react-native-config
  
  
  

  链接库：

  复制代码

  
  $ react-native link react-native-config
  
  
  

  ：Android的额外步骤

  你还需要手动将一个插件应用到你的应用程序，从 android/app/build.gradle:

  复制代码

  
  //2nd line, add a new apply:
  
  
  apply from: project(':react-native-config').projectDir.getPath() +"/dotenv.gradle"
  
  
  

  iOS支持 Info.plist的额外步骤

  • 转到你的项目-> 生成设置->
  • 搜索preprocess预处理""
  • 将 Preprocess Info.plist File 设置为 Yes
  • 集合集 Info.plist Preprocessor Prefix File 到 ${BUILD_DIR}/GeneratedInfoPlistDotEnv.h
  • 集合集 Info.plist Other Preprocessor Flags 到 -traditional
  • 如果未看到这些设置，请验证在顶部( 而不是"基础"选择了"全部"。
  高级Android安装

  如果使用 android/app/build.gradle，则使用不同于标记中指定的包 NAME的applicationIdSuffix 或者 applicationId，例如支持不同的生成变量： 在 android/app/build.gradle 中添加

  复制代码

  
  defaultConfig {
  
  
  . . .
  
  
   resValue"string","build_config_package","YOUR_PACKAGE_NAME_IN_ANDROIDMANIFEST.XML"
  
  
  }
  
  
  

  故障排除

  混淆器的问题

  当启用( 在默认情况下，Android发布版本) 时，它可以在缩小过程中重命名 BuildConfig 类，并防止对本地配置进行React。 若要避免这里问题，请向 android/app/proguard-rules.pro 添加异常：

  复制代码

  
  -keep class com.mypackage.BuildConfig { *; }
  
  
  

  mypackage 应该在你的app/src/main/AndroidManifest.xml 文件中 MATCH的package 值。

  测试

   

  为了模拟 Config.FOO_BAR 用法，在 __mocks__/react-native-config.js 上创建 mock:

  复制代码

  
  //__mocks__/react-native-config.js
  
  
  export default {
  
  
   FOO_BAR: 'baz',
  
  
  };