인프런 커뮤니티 질문&답변
작성한 질문수
export default 관련한 질문
해결된 질문
작성
·
198
·
수정됨
0
안녕하세요 Modules 단계를 듣다가 궁금한 점이 생겨서 여쭤봅니다.
export default {} 를 해야 import 를 할 수 있는 것으로 이해 하였습니다.
그런데 TodoHeader.vue 의 경우 스크립트 단을 아예 만들지 않아서 export default {} 가 없는데 어떻게 App.vue 에서는 TodoHeader를 import 할 수 있는 걸까요?
제가 예상하기로는 export default 단위 블록 안에 아무 내용이 없으면 생략 가능한 것 아닐까 라는 생각을 해보았는데 혹시 맞을까요?
답변 2
0
안녕하세요, 제가 답변이 늦었네요 🙂 export default {} 라는 객체를 하나 내보냈다고 생각하면 됩니다.
아래 코드 참고하세요
export default {}
const a = {};
export default a
0
안녕하세요, 인프런 AI 인턴입니다.
export default {}를 사용하는 경우, 해당 파일에서 단 하나의 객체, 함수, 또는 변수를 내보낼 때 사용합니다. Vue.js에서는 일반적으로 컴포넌트를 내보낼 때 export default를 사용하는데, 이것은 해당 파일의 기본 내보내기를 설정하는 것입니다.
TodoHeader.vue 파일이 스크립트 부분이 생략되었고, export default {} 없이도 App.vue에서 import 할 수 있는 상황에 대해서는 몇 가지 가능성이 있습니다:
1. TodoHeader.vue 파일이 실제로 스타일 또는 템플릿만 정의하고 있고, 자바스크립트 코드가 필요하지 않은 경우, Vue CLI나 웹팩(Webpack)과 같은 빌드 도구는 여전히 해당 Vue 파일을 인식하고 빌드 과정에서 적절히 처리할 수 있습니다. 즉, 비어 있는 스크립트 태그 없이도 해당 컴포넌트를 다른 컴포넌트에서 사용할 수 있게 만들 수 있습니다.
2. 만약 TodoHeader.vue 파일에 스크립트 부분이 아예 없다면, Vue 파일이 단순히 템플릿만 가지고 있는 경우일 수 있습니다. 이 경우, Vue 시스템이 내부적으로 처리를 하여 컴포넌트로서 기능할 수 있도록 합니다.
하지만 일반적으로 export default 구문은 내보낼 대상이 명확히 있을 때 사용되므로, export default가 없다면 그것을 생략할 수 있다기보다는 해당 파일에서 스크립트 정의가 필요하지 않거나 다른 방식으로 처리가 되고 있을 가능성이 큽니다. Vue 컴포넌트에서 스크립트 정의 부분이 완전히 빠진 경우, 해당 컴포넌트에 자바스크립트 로직이 필요 없거나 다른 방법으로 로직이 처리되고 있음을 의미합니다.
질문하신 내용으로는 구체적인 코드 구조를 모르기 때문에 정확한 답변을 드리기 어렵지만, Vue 컴포넌트를 다른 파일에서 import하여 사용하기 위해서는 일반적으로 export default 구문이 포함되어야 합니다. 다만, 특정 빌드 시스템이나 프로젝트 설정에 따라 다른 방식이 적용될 수도 있습니다.