m_shige1979のささやかな抵抗と欲望の日々

プログラムの勉強をしながら学習したことや経験したことをぼそぼそと書いていきます

Github(変なおっさんの顔でるので気をつけてね)

https://github.com/mshige1979

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 ."
  },

補足

androidiosのリリース用時のセットアップ方法などはちょっと複雑なので次回以降にする androidの場合はbuildTypesとかproductFlavorsとかいじることになりそう iosXCode主体で対応する