[Next.js] process.env가 undefined로 나올때

환경변수를 프론트에서 사용하려 했을때 .env.*에 선언되어있음에도 불구하고 undefined로 나올 것이다. 다음과 같이 환경변수가 선언되어있다고 가정하면, 

MY_NAME="lou"

 

Next.js Version 9.4 이상

Next.js 버전이 9.4+ 인경우, 환경변수 이름에 NEXT_PUBLIC_을 프리픽스(prefix) 붙여주면 사용가능해진다. 따라서, MY_NAME 환경 변수명을 NEXT_PUBLIC_MY_NAME으로 바꾸어준다면 해결된다.

 

 

Next.js Version 9.4 미만

그렇지 않을 경우 next.confg.js에 사용할 환경변수를 설정해주어야한다.

module.exports = {
 env: {
    MY_NAME: process.env.MY_NAME,
 },
}