반응형
문제) .env 파일의 비밀키 값을 가져와 사용하고 싶은데 타입 에러가 발생
Cannot find module '@env' or its corresponding type declarations.
설정해주어야 할 것
1. types 폴더 생성 및 env.d.ts파일 생성
2. babel.config.json 파일 설정
3. tsconfig.json 파일 설정
1. types 폴더 생성 및 env.d.ts 파일 생성
root폴더 위치에 types 폴더를 생성하여 주고, 해당 폴더의 하위의 env.d.ts 파일을 생성하여 주었다. env.d.ts 파일은 아래와 같다.
위의 코드에 대해 설명하면, @env모듈의 타입을 설정해준 것이라 할 수 있다. .env파일에서 API_KEY를 가져오는데 .env파일의 API_KEY는 string 타입이다. 모듈명이 .env 가 아닌 @env인 것은 후의 작업인 babel.config.json에서 .env파일을 @env명으로 가져올 수 있도록 설정해두었기 때문이다.
2. babel.config.json 파일 설정
여기서 설정해준 것은 plugins 부분이다. 설정된 내용을 보면, .env 파일을 @env로 설정하고 있음.
3. tsconfig.json 파일 설정
babel.config.json에서 설정해준 것을 추가해준다. typeRoots는 타입들을 선언해둔 폴더에 대한 정보를 설정하는 부분.
반응형