CRA에서 .env 설정 (environment variables)

env 실행 우선순위 (왼쪽이 오른쪽보다 우선순위가 높다)

npm start: .env.development.local > .env.development > .env.local > .env
npm run build: .env.production.local > .env.production > .env.local, .env
npm test: .env.test.local > .env.test > .env (note .env.local is missing)

Create react app에서는 변수명앞에 무조건 REACTAPP가 있어야 인식을 한다.

// .env.development
REACT_APP_URL= "http://localhost:3000"

// .env.production
REACT_APP_URL= "http://m.site.com"

// 사용시
<a href={process.env.REACT_APP_URL}}>URL</a>

NODE_ENV로 현재상태를 구분할 수 있다.

console.log(process.env.NODE_ENV ==="development")

package.json 설정

  "scripts": {
    "start": "env-cmd -f .env.development react-scripts start",
    "build": "env-cmd -f .env.production react-scripts build",
  },

env 파일 수정 후에는 서버를 재 실행해야한다.

https://create-react-app.dev/docs/adding-custom-environment-variables/