create-react-app で作った React アプリで yarn start での開発時と yarn build でビルドした時に使う環境変数を切り替えたい。
.env のファイル名で自動的に切り替わる
create-react-app で作られたファイルにある .gitignore を見ると次のように設定されていました。
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
どうやら次のように読み込まれる設定になっており、より細かい指定のファイルが有ればそちらが優先されるようになっているようです。
.env… 開発時 / ビルド時両方で使用される (デフォルト).env.local… local 環境で使用される (どの環境でも読み込まれるっぽい).env.development,.env.production,.env.test… Environment モードに合わせて使用される.env.development.local,.env.production.local,.env.test.local… local 環境での実行時のEnvironment モードに合わせて使用される
開発用は .env.development.local, ビルド用は .env.production.local の設定ファイルを作成しておけばOK
yarn start 時には .env.development.local が読み込まれる。
ローカル環境で yarn build してしまう場合はビルド用の設定は .env.production.local を作成しておけばOK。
CI などでビルドする場合は、ビルドが実行される環境に .env か .env.production を作成しておけば良さそう。
場合分けが少ないなら .env.loacl 一個で大丈夫そう。
[参考]
エンブん早わかり…
