일단 결론적으로 말하면 CRA에 .env가 내장되어 있어 따로 설치가 필요없습니다.
- .env 파일을 생성한다. pakage.json과 같은 위치에 생성.
- (변수명) = (변수값) 을 지정하는 데, 변수명 앞에 REACT_APP 을 붙여준다!
REACT_APP_API_KEY = "rqe5rqerqerqereqreqrq"
//이런식으로 적어준다.
- 사용할 땐 process.env.REACT_APP_API_KEY로 사용하면 완료.
이 글을 적는 이유는 CRA 환경에서 처음 .env를 사용해 봐서 생각없이 npm i dotenv 설치하고 import 해서 사용하니 오류가 뜨더라. 무슨 이유인지 도통 모르겠어서 열심히 검색해본 결과 새로 설치하면 기존 버전과 달라서 그런지 웹팩 폴리필 설정을 새로 해주어야한다..
아무튼 CRA 환경에서는 환경 변수를 사용하는게 정말 쉽구나 느꼈습니다
결론 : npm i dotenv 하지 마세요!
'Front End > React' 카테고리의 다른 글
React 에서 Swiper.js를 이용하여 캐러셀 Carousel 만들기 TS JS (0) | 2023.06.23 |
---|---|
React 에서 setInterval 사용하는 법 리액트 JS TS (0) | 2023.06.23 |
React 에서 setInterval, timer 사용하는 법 리액트 JS TS (0) | 2023.06.22 |
React에서 React-Hook-Form을 이용할 때 focus 하는 법. 리액트 JS, TypeScript (0) | 2023.06.02 |
React에서 Font Awesom 아이콘 무료로 사용하는 법 (0) | 2023.05.26 |