.env

반응형

 

⏺ 환경변수 파일들의 상세 설명

  📊 환경변수 파일 우선순위 (높은 순서대로)

  1. .env.{NODE_ENV}.local (최우선)
  2. .env.local
  3. .env.{NODE_ENV}
  4. .env (기본값)

  📁 각 파일의 역할과 사용 시나리오

  🔹 .env (기본 환경변수)

  # 모든 환경에서 공통으로 사용되는 기본값
  NODE_ENV=development
  API_BASE_URL=https://api.myapp.com
  APP_NAME=MyApp
  - 용도: 프로젝트 전체 기본 설정
  - git: ❌ 커밋하지 않음 (보안 정보 포함 가능)
  - 예시: API URL, 앱 이름, 기본 포트 등

  🔹 .env.local (개인 로컬 설정)

  # 개발자 A의 개인 설정
  API_BASE_URL=http://localhost:3000
  DEBUG_MODE=true
  DEVELOPER_NAME=김개발
  - 용도: 개발자마다 다른 개인적인 로컬 설정
  - git: ❌ 절대 커밋하지 않음
  - 예시: 로컬 서버 주소, 개인 API 키, 디버그 설정

  🔹 .env.development.local (개발 환경 개인 설정)

  # NODE_ENV=development일 때만 적용되는 개인 설정
  REACT_NATIVE_DEBUGGER=true
  LOG_LEVEL=debug
  HOT_RELOAD=true
  - 용도: 개발 모드에서만 사용하는 개인 설정
  - git: ❌ 커밋하지 않음
  - 예시: 디버거 설정, 로그 레벨, 개발 도구 설정

  🔹 .env.test.local (테스트 환경 개인 설정)

  # NODE_ENV=test일 때만 적용되는 개인 설정
  TEST_DATABASE_URL=sqlite://test_local.db
  MOCK_EXTERNAL_API=true
  SKIP_SLOW_TESTS=true
  - 용도: 테스트 실행 시 개인별 설정
  - git: ❌ 커밋하지 않음
  - 예시: 로컬 테스트 DB, 모킹 설정, 테스트 스킵 설정

  🔹 .env.production.local (프로덕션 환경 개인 설정)

  # NODE_ENV=production일 때만 적용되는 개인 설정
  # (일반적으로 CI/CD나 서버에서 사용)
  SENTRY_DSN=your_production_sentry_key
  PERFORMANCE_MONITORING=true
  - 용도: 프로덕션 빌드나 배포 시 개인/서버별 설정
  - git: ❌ 커밋하지 않음
  - 예시: 프로덕션 API 키, 모니터링 설정

  🎯 실제 사용 예시

  개발자 A의 환경:
  # .env.local
  API_BASE_URL=http://localhost:8080
  DEVELOPER_TOOLS=enabled

  # .env.development.local  
  DEBUGGER_PORT=9090

  개발자 B의 환경:
  # .env.local
  API_BASE_URL=http://192.168.1.100:8080
  DEVELOPER_TOOLS=disabled

  # .env.development.local
  DEBUGGER_PORT=9091

  ⚠️ 중요한 보안 원칙

  1. .local 접미사가 붙은 모든 파일: 개인 설정이므로 git에 커밋하면 안됨
  2. 실제 API 키, 비밀번호, 토큰: 절대 git에 커밋하면 안됨
  3. .env.example: 예시 파일로 git에 커밋해서 다른 개발자가 참고할 수 있게 함

  이렇게 체계적으로 관리하면 팀원들이 각자의 개발 환경을 유지하면서도 프로젝트 설정을 쉽게 공유할 수 있습니다!

 

 

 

 

> NODE_ENV=development 나 NODE_ENV=production 과 같은 플래그와 함께 실행해야해? 만약에 없으면 기본은 development 야? 
  env 파일들은 표준인거야? react-native 프로젝트가 알아서 저 파일들을 NODE_ENV= 값을 넣어서 실행하면 참조하는거야? 
  만약에 android 폴더에서 gradle assembleBundle 같은거 하면 어떻게 돼? 이거할 때도 NODE_ENV 넣어줘야 해? 보통 나는 
  실행을 android studio 랑 xcode 에서 직접하거든?

⏺ 좋은 질문입니다! React Native 환경변수 시스템에 대해 자세히 설명드리겠습니다.

  🔍 NODE_ENV와 .env 파일 동작 방식

  1. NODE_ENV 기본값

  # NODE_ENV가 설정되지 않은 경우
  NODE_ENV가 undefined → React Native는 development로 간주

  기본 동작:
  - NODE_ENV 없음 → development 모드
  - React Native는 기본적으로 development 모드로 실행

  2. .env 파일 로딩 순서

  React Native + Expo에서는 다음 순서로 로딩:

  # NODE_ENV=development일 때
  1. .env.development.local  ← 최우선
  2. .env.local
  3. .env.development
  4. .env                   ← 기본값

  # NODE_ENV=production일 때  
  1. .env.production.local   ← 최우선
  2. .env.local
  3. .env.production
  4. .env                   ← 기본값

  3. Android Studio / Xcode에서 실행할 때

⏺ 📱 실제 실행 환경별 동작

  1. Android Studio에서 실행

  # Android Studio → Run 버튼 클릭
  NODE_ENV가 설정되지 않음 → development 모드
  ↓
  .env.local → .env 순서로 로딩

  2. Terminal에서 실행

  # package.json script 사용
  npm run android           # NODE_ENV=development
  npm run android:release   # NODE_ENV=production

  # 직접 명령어
  NODE_ENV=production npx react-native run-android --mode=release

  3. Gradle 직접 실행

  # android 폴더에서 직접 실행
  cd android
  ./gradlew assembleRelease

  # 이 경우 NODE_ENV 설정이 없음 → development로 간주
  # 환경변수를 명시적으로 설정하려면:
  NODE_ENV=production ./gradlew assembleRelease

  🛠️ 실제 설정 방법

  Option 1: IDE 환경변수 설정 (권장)

  Android Studio:
  1. Run Configuration 편집
  2. Environment Variables에 NODE_ENV=development 추가

  Xcode:
  1. Scheme 편집 (Product → Scheme → Edit Scheme)
  2. Run → Arguments → Environment Variables
  3. NODE_ENV = development 추가

  Option 2: .env 파일 활용 (현재 방식)

 

  Option 3: 환경별 .env 파일 생성

 

현재 상황 (Android Studio/Xcode 직접 실행)

  ✅ 설정 완료된 것:
  - .env → NODE_ENV=development (기본값)
  - .env.development → 개발 환경 설정
  - .env.production → 프로덕션 환경 설정

  ✅ 결과:
  - Android Studio Run → development 모드 자동 적용
  - Xcode Run → development 모드 자동 적용
  - Terminal npm run android → development 모드
  - Terminal npm run android:release → production 모드

  Gradle 직접 실행 시 (선택사항)

  # 개발 빌드
  cd android
  NODE_ENV=development ./gradlew assembleDebug

  # 릴리즈 빌드  
  NODE_ENV=production ./gradlew assembleRelease

  결론

  1. NODE_ENV 명시 없이도 작동: .env 파일로 기본값 설정됨
  2. IDE에서 직접 실행: 별도 설정 없이 development 모드로 작동
  3. 환경변수 파일: React Native + Expo 표준 방식
  4. Gradle 직접 실행: NODE_ENV 설정 권장하지만 필수 아님

 

 

 

현재 프로젝트에서는 환경변수를 직접 하드코딩으로 사용하고 있네요. React Native에서 환경변수를 가져오는 방법들을
  보여드리겠습니다:

  React Native 환경변수 사용 방법

  1. Metro 기본 방식 (추천)

  React Native + Expo에서 기본 지원:

  // 환경변수 직접 접근
  const API_URL = process.env.EXPO_PUBLIC_API_URL;
  const NODE_ENV = process.env.NODE_ENV;

  // .env 파일에서:
  // EXPO_PUBLIC_API_URL=https://api.example.com
  // NODE_ENV=development

  2. babel-plugin-dotenv 방식

  babel.config.js 설정으로 .env 파일 자동 로딩:

  // 코드에서 사용
  const config = {
    apiUrl: process.env.API_BASE_URL,
    debugMode: process.env.DEBUG_MODE === 'true',
    nodeEnv: process.env.NODE_ENV
  };

  3. 현재 프로젝트 개선 방안

  현재 config.ts를 환경변수 기반으로 변경:

  // src/common/config.ts
  export const NODE_ENV = process.env.NODE_ENV || 'production';
  export const API_ENDPOINT = process.env.API_BASE_URL || 'https://myapp.com/api';
  export const DEBUG_MODE = process.env.DEBUG_MODE === 'true';

  // 환경별 조건부 설정
  export const LOG_LEVEL = NODE_ENV === 'development' ? 'debug' : 'error';

  4. TypeScript 타입 안전성

  // types/env.d.ts
  declare module '@env' {
    export const API_BASE_URL: string;
    export const DEBUG_MODE: string;
    export const NODE_ENV: string;
  }

  현재 상황

  1. 패키지에서 NODE_ENV 설정: ✅ 완료
  2. .env 파일들: ✅ 생성됨
  3. 코드에서 하드코딩: ❌ 개선 필요

  현재는 config.ts에서 값들이 하드코딩되어 있어서 .env 파일의 이점을 활용하지 못하고 있습니다. process.env.변수명으로 가져와서
  사용하면 환경별로 다른 설정을 자동으로 적용할 수 있습니다.

 

 

 

> 안드로이드 배포를 위해서 빌드할 때는 ./gradlew bundleRelease 명령어를 사용해서 콘솔에서 하기 때문에 NODE_ENV=production 을 
  붙일 수 있다지만, ios 는 archive 를 클릭하는데.. 그러면 이걸 어떻게 적용함? 그리고 현재는 상관없지? 어차피 하드코딩되어 
  있어서 development 이건, production 이건 간에 전부 같은 값들이니깐? 어디 영향 받은 곳이 있어?

 

1. 현재 상황 - 하드코딩으로 인한 영향 없음 ✅

  // config.ts에서 하드코딩
  export const NODE_ENV: string = 'production';
  export const API_ENDPOINT: string = 'https://myapp.com/api';

  - 현재는 NODE_ENV 설정이 전혀 의미 없음
  - development든 production이든 항상 같은 값
  - .env 파일 존재하지만 코드에서 사용 안함

  2. iOS Archive에서 환경변수 설정

  iOS Xcode Archive 시 NODE_ENV 설정 방법:

  Option 1: Scheme 환경변수 설정
  1. Xcode → Product → Scheme → Edit Scheme
  2. Run/Archive → Arguments 탭
  3. Environment Variables → NODE_ENV = production

  Option 2: Build Settings
  # Xcode Build Settings에서
  GCC_PREPROCESSOR_DEFINITIONS = NODE_ENV=production

  Option 3: Script Phase 추가
  # Build Phases → New Run Script Phase
  export NODE_ENV=production

  3. 실제 사용되는 곳

  코멘트에 따르면 NODE_ENV는 현재:
  - devTools 설정 (거의 사용 안함)
  - push token 관련

  하지만 실제 코드에서는 **하드코딩으로 'production'**이라서 어떤 설정을 해도 변화 없습니다.

  4. 결론

  - 현재: NODE_ENV 설정해도 의미 없음 (하드코딩)
  - iOS Archive: 환경변수 설정 가능하지만 효과 없음
  - Android gradle: 마찬가지로 효과 없음
  - 실제 영향 받는 곳: 없음 (전부 같은 값)

  환경변수 시스템을 실제로 활용하려면 config.ts를 process.env.NODE_ENV로 수정해야 합니다.

 

 

 

반응형

댓글

Designed by JB FACTORY