[React-Native] environment varible 파일 만들기 (.env)

다음 내용은 Using environment variables in a React Native App.을 일부 번역한 내용입니다.

react-native-dotenv 설치

$ npm i react-native-dotenv

ios인 경우

ios 디렉토리내에서 명령 실행

$ cd /ios
$ pod install

babel 세팅

babel.config.js파일에 아래와 같이 세팅

module.exports = {
  "presets": ["module:metro-react-native-babel-preset"],
  "plugins": [
    ["module:react-native-dotenv", {
      "moduleName": "@env",
      "path": ".env",
      "blacklist": null,
      "whitelist": null,
      "safe": true,
      "allowUndefined": true
    }]
  ]
};

.env파일 생성

root directory(package.json과 같은레벨)에 .env파일을 생성합니다.

API_KEY=123456789abcdefghijk

environment variable 사용하기

import {API_KEY} from '@env';

console.log(API_KEY) // 123456789abcdefghijk

그래도 안되는 경우

github issue를 참고해보면, yarn start --reset-cache를 해보라고 하고, 저는 이걸로 해서 제대로 동작했습니다.
만약 babel.config.js를 위와 같이 변경하였을 때, Unable to resolve module @env와 같은 에러가 발생하면 시도해보시면 될 것 같습니다.
(컴터를 껐다키라는것도 있네요)