[TIL]2024.02.01 jsconfig.json

JunSeok·2024년 2월 1일

TIL

목록 보기
18/27

jsconfig.json 절대 경로를 지정한다는 건 알겠지만 자세한 개념은 잘 몰라서 확실하게 알아 봤다.

jsconfig.json란

jsconfig.json 파일은 JavaScript 프로젝트에서 사용되는 설정 파일 중 하나로, 주로 Visual Studio Code 및 기타 일부 개발 도구에서 활용됩니다.

  • 절대 경로 지원:
    jsconfig.json 파일을 사용하면 프로젝트 내에서 절대 경로를 사용할 수 있고 이것은 모듈 경로를 작성할 때 상대 경로 대신에 프로젝트의 루트 디렉토리를 기준으로 한 절대 경로를 사용할 수 있게 해준다. 이는 프로젝트의 구조가 복잡하거나 중첩된 경우에 특히 유용함.

  • 프로젝트 구조의 단순화:
    상대 경로를 사용하면 프로젝트 구조가 변경될 때 마다 경로를 수정 하는데 jsconfig.json을 사용하면 프로젝트의 구조를 변경하더라도 파일 경로를 일일이 수정하지 않아도 되므로 프로젝트의 유지보수가 편리해진다.

  • IDE(Integrated Development Environment)의 지원 강화:
    jsconfig.json 파일은 주로 Visual Studio Code와 같은 IDE에서 사용되며, 이를 통해 IDE가 프로젝트의 구조를 더 잘 이해하고 코드를 더 빠르게 탐색하고 분석할 수 있게 된다.

  • 자동 완성 및 코드 탐색:
    IDE에서 jsconfig.json 파일을 활용하면 자동 완성 기능 및 코드 탐색 기능이 개선 된다고 하는데 이는 모듈이나 라이브러리를 더 쉽게 찾을 수 있게 도와주며, 코드 작성 속도를 향상시킨다고 한다.

{
  "compilerOptions": {
    "baseUrl": "./src",
    "paths": {
      "@components/*": ["components/*"],
      "@utils/*": ["utils/*"]
    }
  },
  "include": ["src/**/*.js"]
}

예를 들어 jsconfig.json 파일을 사용하여 프로젝트의 src 폴더를 기준으로 절대 경로를 설정한 예시를 가져와 봤다.
위의 설정에서는 @components/ 및 @utils/와 같은 접두사를 사용하여 각 모듈의 경로를 설정하고 있다. 이를 통해 상대 경로 대신에 이러한 절대 경로를 사용하여 모듈을 불러올 수 있게 된다.

0개의 댓글