react-native-configで環境変数を参照する2

前回の続き

m-shige1979.hatenablog.com

今回やること

環境別のファイルを作成して、それぞれのファイルで読み込むようにする

環境別ファイルを作成する

.env

MODE=dev
APP_NAME=TEST
VERSION=0.0.1

.env.staging

MODE=staging
APP_NAME=STAGING
VERSION=0.0.1

.env.production

MODE=production
APP_NAME=RELEASE
VERSION=0.0.1

簡単な実行方法

android

シェル変数の「ENVFILE」に環境変数ファイルを設定することで対応可能またはENVFILEを環境変数名（export）化しても良い

ENVFILE=.env yarn android
または
ENVFILE=.env.staging yarn android
または
ENVFILE=.env.production yarn android

ios

「/tmp/envfile」に環境変数ファイルを設定することで対応可能またはENVFILEを環境変数名（export）化しても良い

echo '.env' > /tmp/envfile && yarn ios
または
echo '.env.staging' > /tmp/envfile && yarn ios
または
echo '.env.production' > /tmp/envfile && yarn ios

※iosを実機で動作させる場合はyarnコマンドではなく、Xcodeで動作させることになるため、別途対応が必要

package.json設定

簡略化したコマンドを作成

  "scripts": {
    "android": "react-native run-android",
    "android_dev": "ENVFILE=.env yarn android",
    "android_stg": "ENVFILE=.env.staging yarn android",
    "android_prd": "ENVFILE=.env.production yarn android",
    "ios": "react-native run-ios",
    "ios_dev": "echo '.env' > /tmp/envfile && yarn ios",
    "ios_stg": "echo '.env.staging' > /tmp/envfile && yarn ios",
    "ios_prd": "echo '.env.production' > /tmp/envfile && yarn ios",
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint ."
  },