[React,TS] 리액트에서 절대경로 사용하기

 

보통 리액트에서 경로를 지정하다보면

 

 

'../components/Header'

와 같은 상대경로를 많이 사용하게 될 것이다.

 

이를 

 

'components/Header'

와 같은 조금 더 깔끔히 절대경로로 할 수 있는 방법을 알아보자.

 

 

방법은 생각보다 간단하다

 

 

 

"baseUrl": "src",

"paths": {
  "components/*": ["components/*"],
}

tsconfing.json 파일에 위 부분을 추가하면 된다.

 

 

baseUrl을 설정한 주소를 기반으로 path를 설정할 수 있다.

 

 

혹시 적용이 안된다면

 

 

"baseUrl": "src",

"paths": {
  "components/*": ["/components/*"],
}

위처럼 적진 않았는지 확인해보자.

 

 

또한, 바로 적용이안된다면 VSCODE를 재시작하거나 서버를 재시작해보는것이 방법이 될 수 있다.