❌ 에러 발생
날씨 api를 호출하던 도중 .env에서 정의한 API Key에서 undefined로 반환되어 401 (unauthorization) 에러가 발생했다.
Key값도 올바르고 .env 파일도 최상단에 있었는데 에러가 발생했고 .env 파일에 있는 Key를 가져오려면 dotenv 라이브러리를 사용해야한다는 것을 알게되었다.
그래서 오늘은 dotenv 라이브러리에 대해서 알아보고자 한다.
Yarn 버전 3 이하를 사용할 경우 node_modules에 이미 dotenv가 내장되어 있기 때문에 굳이 이 라이브러리를 설치해주지 않아도 자동적으로 환경변수에 접근할 수 있다.
정의
Github에 API Key를 올릴 때는 Key 값이 유출되지 않도록 항상 환경변수 파일에 숨겨서 올려야 한다. 이때 환경변수 파일에 Key를 저장하고 접근해줄 수 있도록 쓰는 라이브러리가 dotenv이다.
설치
npm install dotenv
yarn add dotenv
사용 방법
API Key를 호출하고자 하는 곳에 dotenv를 import 해주면 된다.
import dotenv from 'dotenv';
dotenv.config()💡 해결 방법
나는 Yarn Berry를 사용하고 있었기 때문에 dotenv 라이브러리를 설치해주어야 했고 설치 후 dotenv를 import 해주었다.
그랬더니 Cannot find module 'fs' 에러가 발생했다.
찾아보니 CRA(create-react-app)로 만든 React에서는 dotenv 라이브러리가 이미 내장되어 있기 때문에 변수명이 REACT_APP으로 시작하면 자동적으로 REACT_APP로 시작하는 변수에 접근해주어 따로 import를 할 필요가 없다고 되어있었다.
나의 경우 Yarn Berry를 사용하고 있어 module_nodes에 dotenv 라이브러리가 없어 설치가 필요했고 dotenv 라이브러리가 있으면 React에서는 자동적으로 REACT_APP으로 시작하는 변수에 접근해주기 때문에 굳이 import와 config를 해주지 않아도 됐었다.
그래서 저 코드를 지워주니 에러가 사라지면서 API Key가 정상적으로 호출되었다.
