[react] .process.env.REACT_APP

✍ 공부

Po_tta_tt0 2021. 12. 9. 13:10

문제 상황

드림코딩 강의를 들으면서

분명히 하라는 대로 했는데 계속해서 문제가 생겼다.

firebase도 일부러 다운그레이드를 해서

버전 7로 실행했는데.

계속 process.env.REACT_APP_FIREBASE_API_KEY가 undefined라는 것

key 값이 잘못되었나 확인을 하고

.env 파일에서 값을 복붙해 컴포넌트에 직접 담았을 때는 정상적으로 작동되었다.

따라서

key값에는 문제가 없고,

_FIREBASE_API_KEY 뿐만 아니라 .env 파일에 담아둔 키들이 활동을 못하는 것 같았다

해결방법

일단 맨 처음 할 일은

.env파일에 ,를 넣은 것은 아닌지 살펴보고

.env파일을 root에 생성한 것이 맞는지 다시 확인한다.

아무리 해도 코드에 문제가 없다면

'dotenv'를 설치하면 된다

1. dotenv를 설치한다

yarn 이용 : yarn add dotenv
npm 이용 : npm install --save dotenv

2. 사용하고자 하는 컴포넌트에 아래 코드를 추가한다

import dotenv from "dotenv";
require("dotenv").config();

dotenv