React 절대경로 설정하는 방법

🙌 절대 경로란 ?

./Foo, ../foo, ../../../foo-bar 같이 상대 경로로 작성할 경우, 이 파일을 다른 경로로 옮길 경우 상대경로이기 때문에 path가 달라져서 import 오류가 필연적으로 납니다.

👉 절대경로는,

import { Header } from 'components/Header'
import { HeaderContainer } from 'containers/HeaderContainer' 

이런 구조로 사용합니다.

🙌 절대 경로 설정하는 방법

tsconfig.json 또는 jsconfig.json

{
  "compilerOptions": {
    "baseUrl": "src"
  },
  "include": ["src"]
}

이렇게 해주면 된다.

출처 : https://kyounghwan01.github.io/blog/React/absoulte-import/#absolute-imports-%E1%84%80%E1%85%A1-%E1%84%86%E1%85%AE%E1%84%8B%E1%85%A5%E1%86%BA%E1%84%8B%E1%85%B5%E1%86%AB%E1%84%80%E1%85%A1