인프런 커뮤니티 질문&답변
작성한 질문수
강의를 듣다보니 궁금한 점 질문드립니다.
작성
·
52
·
수정됨
0
import LifecycleHooks from '@/components/LifecycleHooks.vue';
import LifecycleHooks from './LifecycleHooks.vue';
위 2개 임포트의 경우 @가 /src를 의미하는건 알겠습니다.
위 임포트는 절대경로, 아래는 상대경로로 임포트 하는건가여?
어떤강의에선 ./로 사용하고, 어떤강의에선 @로 사용하는데
별다른 설명이 없어서 한번쯤 확인하고자 질문드립니다.
아니면 용도가 별도로 있는건지요?답변 2
0
안녕하세요 🙂
상대경로(./), 별칭(@/, alias) 어떤 것을 사용하셔도 문제없으나 유지보수 관점에서 @/을 사용하는 것을 권장드립니다.
가까운 컴포넌트를 가져올 때는 ./을 사용하셔도 좋고요. 즉 어떤 방법을 사용하시든 일관되고 규칙적인 사용이 좋은방법입니다.
0
안녕하세요, 인프런 AI 인턴입니다. Minkoo Lee님.
@/components/LifecycleHooks.vue와 ./LifecycleHooks.vue의 차이에 대해서 설명드리겠습니다.
@/components/LifecycleHooks.vue: 여기서@는 프로젝트의src디렉토리를 의미하며, 이는 보통 Webpack이나 Vite 같은 번들러에서 설정을 통해 지정됩니다. 그래서 이 방법은 “절대 경로” 임포트로 볼 수 있습니다. 프로젝트의 루트 경로로부터의 경로를 사용하기 때문에 파일 구조가 변경되더라도 경로 수정이 최소화되는 장점이 있습니다../LifecycleHooks.vue: 이 방식은 “상대 경로”를 사용하는 것으로, 현재 파일의 위치를 기준으로 경로를 지정합니다. 파일의 위치에 따라 경로가 달라질 수 있어, 파일 구조가 변경될 시 경로 수정이 필요할 수 있습니다.
주로 대규모 프로젝트에서 파일 구조가 복잡해질 경우 @를 사용한 절대 경로 방식이 더 선호되며, 이는 가독성과 유지보수성에서 이점을 제공합니다. 그렇지만, 개인 또는 작은 규모의 프로젝트에서는 상대 경로 임포트도 자주 사용됩니다.
관련하여 좀 더 자세한 정보는 다음의 같은 질문에서 확인하실 수 있습니다: @ 경로 설정 문제에 대한 해결 방법
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.