📌 VS Code에서 자동 import 시 alias가 아닌 상대 경로가 표시되는 문제 해결

📌 VS Code에서 자동 import 시 alias가 아닌 상대 경로가 표시되는 문제 해결

개발 중에 Quick Fix (자동 import)를 사용할 때, 원하는 alias 경로가 아닌 상대 경로가 자동으로 추가되는 문제가 발생했다.

• 원하는 import 형태

  import Logo from "@/components/logo";

• 실제 자동 import된 형태

  import Logo from "./logo";

이 문제의 원인은 VS Code 설정(typescript.preferences.importModuleSpecifier)이 alias 대신 상대 경로를 우선하도록 되어 있기 때문이다.

---

✅ 해결 방법: VS Code 설정 변경

1. VS Code 설정 열기
   Ctrl + Shift + P (Mac: Cmd + Shift + P) → "Preferences: Open Settings (JSON)" 검색 후 선택

2. 설정 추가
   아래 JSON 설정을 추가한다.

   {
     "typescript.preferences.importModuleSpecifier": "non-relative"
   }

3. VS Code 재시작
   변경된 설정이 적용되도록 VS Code를 재시작하거나, Ctrl + Shift + P (Mac: Cmd + Shift + P) → "TypeScript: Restart TS Server" 실행

---

이제 Quick Fix를 실행하면 상대 경로가 아닌 alias import가 정상적으로 적용될 것이다. 🚀
앞으로도 alias import가 잘 유지되는지 확인하면서 개발하면 좋을 것 같다! 🎯