최근에 코드를 치던 도중 자꾸 다른 곳에서 import를 해올 때 자동으로 .js가 생성되지 않고 빠져가지고 찾아야하는 번거로움을 겪게 되었습니다.
해결 방법은 간단합니다.
바로 VSCode 설정을 수정하는 방법 입니다.
읽기 전 방법이 총 2가지 이기 때문에 1번 방법이 되지 않으면 바로 2번 방법으로 가주세요.
VSCode 설정 수정하기
1. VSCode 설정 열기
- 먼저, Visual studio Code를 실행한 후, 아래 단축키를 사용해 설정을 엽니다.
- Windows/Linux: Ctrl + ,
- Mac: Cmd +
또는, VSCode 상단 메뉴에서 파일(File) -> 기본 설정(Preferences) -> 설정(Settings)으로 이동할 수도 있습니다.
2. 검색창에 settings.json 검색
- 설정 창에서 우측 상단에 있는 검색창에 settings.json을 입력한 후, 설정(Json)이라는 항목을 클릭하세요.
3. 설정 파일에 옵션 추가
- 이제 settings.json 파일이 열렸을 것입니다. 이 파일에서 아래 설정을 추가해줍니다.
{
"javascript.suggest.paths": true, // 경로 자동완성 허용
"javascript.preferences.importModuleSpecifierEnding": "js", // JavaScript import 시 .js 붙이기
"typescript.preferences.importModuleSpecifierEnding": "js" // TypeScript import 시 .js 붙이기
}
그리고 저장해주면 됩니다.
이제 여기서 VSCode에서 저 설정하는 부분을 찾지 못한 분들을 위해 직접 파일을 찾아서 열어서 수정해 주겠습니다.
추천드리는 방법!
- settings.json 파일은 각 사용자마다 위치가 다를 수 있습니다. 일반적으로 사용자 설정은 다음 경로에 저장됩니다:
- Windows/Linux: C:\Users\<사용자 이름>\AppData\Roaming\Code\User\settings.json
- Mac: /Users/<사용자 이름>/Library/Application Support/Code/User/settings.json
- 이 파일을 직접 열어서 편집할 수도 있습니다.
settings.json을 열었으면 아까 설명한 설정 내용을 추가한 후 저장하시면 됩니다:
{
"javascript.suggest.paths": true,
"javascript.preferences.importModuleSpecifierEnding": "js",
"typescript.preferences.importModuleSpecifierEnding": "js"
}
좀더 쉽게 이해하기 위해 사진을 보여드리겠습니다.
후우 이러고 저장하면 아주 잘 됩니다 하하!!
'TIL' 카테고리의 다른 글
CPU란? (기초) (0) | 2024.10.10 |
---|---|
chome_dino_websocket_game 개인 프로젝트 트러블 슈팅 (0) | 2024.10.07 |
REST, REST API, RESTful 특징 (간단 글 소개) (1) | 2024.09.30 |
express.urlencoded()에 대한 간단한 조사 (0) | 2024.09.28 |
JavaScript 다양한 디자인 패턴 (간단하게) (0) | 2024.09.26 |