본문 바로가기

Frontend

TS2440: Import declaration conflicts with local declaration of ~

문제 상황 

다른 파일에서 작성된 type 파일을 import 해와서 써주려고 했는데 제목과 같은 오류가 발생하였다. 

import만 해와서 쓰는데 뭐가 문제지?하고 생각했었다.

 

문제 원인 

import 해온 파일로 다시 돌아가보자. 

해당 파일에서는 파일 안에 type등 다 구현이 되어있고 나는 가져와서 쓰기만 하면 되는 것이다. 

 

ex) ~/components/pages/story/helloPage

 

export interface AType { 
	id?: String; 
    articleId?: string; 
    ....
}

 

import 해온 파일에 이런 내용이 작성되어있다고 가정해보자. 

 

그럼 나는 새로 연 파일에서 위에서 작성한 helloPage를 import 해와서 사용하지 않을 것인가. 

근데 내가 새로 연 파일에서 위와 같은 코드를 똑같이 사용했다면 제목과 같은 오류가 발생한다. 

import { AType } from '~components/pages/story/helloPage';

Atype에서 빨간줄 에러가 뜰것이다. 

 

해결 방법 

새로 연 파일에서는 AType부분은 지워도 된다. 왜냐하면 import 할 때 그 부분은 가져오므로. 

import { AType } from '~components/pages/story/helloPage';

이렇게만 import 해놓으면 새로 연 파일에서 따로 다시 정의를 해놓지 않아도 실행될때 자동으로 실행이 된다.