React에서 .env환경변수 사용하기

빈지은·2023년 11월 17일
0

JS

목록 보기
7/10
post-thumbnail

.env

외부에 알려지면 안되는 api_key 또는 db관련 정보등 보안이 필요한 값들은 유지보수를 위해 .env파일에 환경변수로 만들어 변수를 꺼내와 사용한다

.env파일은 항상 최상위 루트에 파일을 만들어야 한다

.env파일은 깃에 올라가면 안되기 때문에 gitgnore에 추가해주어야 한다

create-react-app에서 .env사용하기

1.환경변수 작성

환경변수를 만들어 주기 위해서는 앞에 REACT_APP으로 시작해야한다
REACT_APP로 시작하지 않으면 무시되기 때문에 앞에 작성 후 변수이름을 만들어야 한다

2.환경변수 불러오기

.env에 등록된 변수는 import할 필요없이 process.env.로 환경변수를 가져와 사용하면 된다

vite에서 .env사용하기

1.환경변수 작성

vite에서 환경변수를 작성할 때는 REACT_APP이 아닌 VITE_를 앞에 작성해주면 된다

2.환경변수 불러오기

process.env.가 아닌 import.meta.env.로 접근하면 된다

profile
이작품의지은이

0개의 댓글