[React] dovenv

haxwon·2023년 3월 31일
0

Library

목록 보기
3/5
post-thumbnail

global로 테스트서버와 실서버를 관리해주는 환경변수의 설정이 필요하게되어 사용해보게 되었다.

👉 install npm dotenv

❔How to Use?

프로젝트 루트 경로에 아래와 같은 파일을 생성한다.

.env.production (npm run build 시 해당 URL로 파싱)

REACT_APP_BASE_URL=사용하고자 하는 실서버용 URL

.env.development (npm run start시 해당 URL로 파싱)

REACT_APP_BASE_URL=사용하고자 하는 개발용 URL

❔.env 파일 생성시 확인!

  1. 선언 후 세미콜론(;) 은 없어야 함
  2. URL은 “ “이나 ‘ ‘와 같은 따옴표 없이 작성

그리고 사용하고자 하는 파일 내에서 호출하여 필요한 부분에 URL을 가져와서 사용하면 된다.

server.tsx

const URL = process.env.REACT_APP_BASE_URL
...

const client = axios.create({
baseURL: URL,
})
... 
profile
그냥 하는 프론트엔드 개발자

0개의 댓글