我如何告诉 react-native 要查看的 .env 文件?
How can I tell react-native what .env file to look at?
在 windows,我正在开发一个白标应用程序并尝试使用环境变量来构建代码特定的版本。我正在使用 react-native-config
并按照他们在 GitHub 上的设置进行操作,但出于某种原因 SET ENVFILE=.env.myenvironment
对我没有任何作用,即使在 build-gradle
中定义了地图,例如这个:
project.ext.envConfigFiles = [
debug: ".env",
release: ".env",
anothercustombuild: ".env.custombuild",
]
有什么想法吗?
我正在使用 vscode 集成终端传递 react-native-config
命令来告诉 RN 要查看哪个 .env 文件,但它根本不起作用..
我开始为 windows 使用 powershell 并尝试了正确的命令。它创造奇迹。例如
$env:ENVFILE=".env.mycustomenvironment"; react-native run-android
。它对于 react-native run-ios
和发布版本应该是一样的。
请记住,截至目前(08/20/2019),react-native-config
在将 .env 变量暴露给您的 .JS 文件时无法正常使用 RN 0.60+ 中的产品风格,如果您正在为此寻找解决方法,请查看 但 tl;dr 是将 react-native-config
与 react-native-build-config
.
一起使用
我得到了使用 flavors 的 react-native-config。 (RN 0.60+ ) 您不需要使用其他库。
这是一个对我有用的白色标签示例:
project.ext.envConfigFiles = [
client1devdebug: ".env.client1.debug",
client1devrelease: ".env.client1.release",
client2devdebug: ".env.client2.debug",
client2devrelease: ".env.client2.release",
]
然后在配置中:
productFlavors {
client1 {
dimension "client"
resValue "string", "build_config_package", "PACKAGE_NAME_IN MANIFEST"
applicationId "com.app1"
}
client2 {
dimension "client"
resValue "string", "build_config_package", "PACKAGE_NAME_IN MANIFEST"
applicationId "com.app2"
}
dev {
...
dimension "environment"
}
stage {
minSdkVersion 21
resValue "string", "app_name", "Stage"
dimension "environment"
}
production {
minSdkVersion 21
resValue "string", "app_name", "Prod"
dimension "environment"
}
在 gradle 中配置风格后,为了允许 react-native 查看项目文件夹根目录中的自定义 .env 文件,您必须添加到
android/app/build.gradle
在我的示例中,我使用相同的代码库为 android 设备创建了两个应用程序,一个用于 group1,一个用于 group2
//将此添加到 app/build.gradle
的第 3 行
project.ext.envConfigFiles = [
projecta: ".env.development.android.projecta",
projectb: ".env.development.android.projectb",
]
//别忘了加上
android {
compileSdkVersion rootProject.ext.compileSdkVersion
flavorDimensions “default” // add this line
compileOptions {
sourceCompatibility JavaVersion.VERSION_1_8
targetCompatibility JavaVersion.VERSION_1_8
}
然后将此数组中的键与您的产品口味进行匹配
productFlavors {
project1 {
minSdkVersion rootProject.ext.minSdkVersion
applicationId 'com.nativeapp.projecta'
targetSdkVersion rootProject.ext.targetSdkVersion
resValue "string", "build_config_package", "com.nativeapp"
}
project2 {
minSdkVersion rootProject.ext.minSdkVersion
applicationId 'com.nativeapp.projectb'
targetSdkVersion rootProject.ext.targetSdkVersion
resValue "string", "build_config_package", "com.nativeapp"
}
}
还要确保 applicationId 和 resValue 以您的应用程序包名称开头
在我的例子中是 'nativeapp',但您可以在 MainActivity.java 文件中找到您的文件。
如果你深入 android/app/main/java/com/ 目录,你可以找到这个。
在此之后,您可以在需要时配置脚本,如下所示
"scripts": {
"android:project1": "ENVFILE=.env.development.projecta react-native run-android --variant=projectaDebug --appIdSuffix=projecta",
"android:project2": "ENVFILE=.env.development.projectb.android react-native run-android --variant=projectbDebug --appIdSuffix=projectb",}
注意:添加脚本时,变体必须是风味名称,例如 'project2' 后跟 'Debug' = 'projectb' 因为这是您的默认 buildType
还要确保在 android/app/src/ 中为每种口味创建了相关文件夹。
就我而言
android/app/src/projecta/
android/app/src/projecta/
如果所有设置都正确,当您使用您创建的脚本进行构建时,它应该会创建正确的 res 文件夹和 android 清单文件。
如果要更改每个单独应用程序实例的名称,请更改 res/values
目录中的 strings.xml。
<resources>
<string name="app_name">Project1</string> //this will be the name of your app when its built in your emulator
</resources>
将此添加到您的 package.json
文件中:
"yourCustomEnv:android-windows": "SET ENVFILE=.env.yourCustomEnv && npm run android",
"yourCustomEnv:android-mac": "ENVFILE=.env.yourCustomEnv; npm run android",
"yourCustomEnv:ios": "ENVFILE=.env.yourCustomEnv; npm run ios",
然后,在yourCustomEnv
模式下运行,运行:
对于Android:
- 于 windows:
运行 npm run yourCustomEnv:android-windows
- 于 mac:
运行 npm run yourCustomEnv:android-mac
对于iOS
运行 npm run yourCustomEnv:ios
完整示例
如果我们假设您的自定义环境文件是 .env.staging
,请将其添加到您的 package.json
文件中:
"staging:android-windows": "SET ENVFILE=.env.staging && npm run android",
"staging:android-mac": "ENVFILE=.env.staging; npm run android",
"staging:ios": "ENVFILE=.env.staging; npm run ios",
然后,使用 .env.staging
变量 运行,运行:
对于Android:
- 于 windows:
运行 npm run staging:android-windows
- 于 mac:
运行 npm run staging:android-mac
对于iOS
运行npm run staging:ios
在 windows,我正在开发一个白标应用程序并尝试使用环境变量来构建代码特定的版本。我正在使用 react-native-config
并按照他们在 GitHub 上的设置进行操作,但出于某种原因 SET ENVFILE=.env.myenvironment
对我没有任何作用,即使在 build-gradle
中定义了地图,例如这个:
project.ext.envConfigFiles = [
debug: ".env",
release: ".env",
anothercustombuild: ".env.custombuild",
]
有什么想法吗?
我正在使用 vscode 集成终端传递 react-native-config
命令来告诉 RN 要查看哪个 .env 文件,但它根本不起作用..
我开始为 windows 使用 powershell 并尝试了正确的命令。它创造奇迹。例如
$env:ENVFILE=".env.mycustomenvironment"; react-native run-android
。它对于 react-native run-ios
和发布版本应该是一样的。
请记住,截至目前(08/20/2019),react-native-config
在将 .env 变量暴露给您的 .JS 文件时无法正常使用 RN 0.60+ 中的产品风格,如果您正在为此寻找解决方法,请查看 react-native-config
与 react-native-build-config
.
我得到了使用 flavors 的 react-native-config。 (RN 0.60+ ) 您不需要使用其他库。 这是一个对我有用的白色标签示例:
project.ext.envConfigFiles = [ client1devdebug: ".env.client1.debug", client1devrelease: ".env.client1.release", client2devdebug: ".env.client2.debug", client2devrelease: ".env.client2.release", ]
然后在配置中:
productFlavors {
client1 {
dimension "client"
resValue "string", "build_config_package", "PACKAGE_NAME_IN MANIFEST"
applicationId "com.app1"
}
client2 {
dimension "client"
resValue "string", "build_config_package", "PACKAGE_NAME_IN MANIFEST"
applicationId "com.app2"
}
dev {
...
dimension "environment"
}
stage {
minSdkVersion 21
resValue "string", "app_name", "Stage"
dimension "environment"
}
production {
minSdkVersion 21
resValue "string", "app_name", "Prod"
dimension "environment"
}
在 gradle 中配置风格后,为了允许 react-native 查看项目文件夹根目录中的自定义 .env 文件,您必须添加到
android/app/build.gradle
在我的示例中,我使用相同的代码库为 android 设备创建了两个应用程序,一个用于 group1,一个用于 group2
//将此添加到 app/build.gradle
project.ext.envConfigFiles = [
projecta: ".env.development.android.projecta",
projectb: ".env.development.android.projectb",
]
//别忘了加上
android {
compileSdkVersion rootProject.ext.compileSdkVersion
flavorDimensions “default” // add this line
compileOptions {
sourceCompatibility JavaVersion.VERSION_1_8
targetCompatibility JavaVersion.VERSION_1_8
}
然后将此数组中的键与您的产品口味进行匹配
productFlavors {
project1 {
minSdkVersion rootProject.ext.minSdkVersion
applicationId 'com.nativeapp.projecta'
targetSdkVersion rootProject.ext.targetSdkVersion
resValue "string", "build_config_package", "com.nativeapp"
}
project2 {
minSdkVersion rootProject.ext.minSdkVersion
applicationId 'com.nativeapp.projectb'
targetSdkVersion rootProject.ext.targetSdkVersion
resValue "string", "build_config_package", "com.nativeapp"
}
}
还要确保 applicationId 和 resValue 以您的应用程序包名称开头
在我的例子中是 'nativeapp',但您可以在 MainActivity.java 文件中找到您的文件。
如果你深入 android/app/main/java/com/ 目录,你可以找到这个。
在此之后,您可以在需要时配置脚本,如下所示
"scripts": {
"android:project1": "ENVFILE=.env.development.projecta react-native run-android --variant=projectaDebug --appIdSuffix=projecta",
"android:project2": "ENVFILE=.env.development.projectb.android react-native run-android --variant=projectbDebug --appIdSuffix=projectb",}
注意:添加脚本时,变体必须是风味名称,例如 'project2' 后跟 'Debug' = 'projectb' 因为这是您的默认 buildType
还要确保在 android/app/src/ 中为每种口味创建了相关文件夹。
就我而言
android/app/src/projecta/
android/app/src/projecta/
如果所有设置都正确,当您使用您创建的脚本进行构建时,它应该会创建正确的 res 文件夹和 android 清单文件。
如果要更改每个单独应用程序实例的名称,请更改 res/values
目录中的 strings.xml。
<resources>
<string name="app_name">Project1</string> //this will be the name of your app when its built in your emulator
</resources>
将此添加到您的 package.json
文件中:
"yourCustomEnv:android-windows": "SET ENVFILE=.env.yourCustomEnv && npm run android",
"yourCustomEnv:android-mac": "ENVFILE=.env.yourCustomEnv; npm run android",
"yourCustomEnv:ios": "ENVFILE=.env.yourCustomEnv; npm run ios",
然后,在yourCustomEnv
模式下运行,运行:
对于Android:
- 于 windows:
运行 npm run yourCustomEnv:android-windows
- 于 mac:
运行 npm run yourCustomEnv:android-mac
对于iOS
运行 npm run yourCustomEnv:ios
完整示例
如果我们假设您的自定义环境文件是 .env.staging
,请将其添加到您的 package.json
文件中:
"staging:android-windows": "SET ENVFILE=.env.staging && npm run android",
"staging:android-mac": "ENVFILE=.env.staging; npm run android",
"staging:ios": "ENVFILE=.env.staging; npm run ios",
然后,使用 .env.staging
变量 运行,运行:
对于Android:
- 于 windows:
运行 npm run staging:android-windows
- 于 mac:
运行 npm run staging:android-mac
对于iOS
运行npm run staging:ios