인프런 커뮤니티 질문&답변
작성한 질문수
default export가 아닌 named export일 때 lazy사용법
해결된 질문
23.04.09 23:21 작성
·
748
1
ListPage컴포넌트가
export default ListPage가 아니라
const ListPage = () => { ... }
export {ListPage}
처럼 한 경우에는 어떻게 import 해야 하나요?
답변 1
1
유동균
지식공유자
2023. 04. 10. 01:01
안녕하세요, Tae-Hui Kim님
기본적인 원리를 이해하시면 쉽습니다.
코드에서 작성한 import 구문(import('./pages/ListPage/index'))은 최종적으로 { default: 해당 컴포넌트 } 를 리턴합니다.
즉, named export일 경우에는 위와 같은 형태를 맞춰주면 됩니다.
const ListPage = lazy(() =>
import("./pages/ListPage/index").then(({ ListPage }) => ({
default: ListPage,
}))
);
const ViewPage = lazy(() =>
import("./pages/ViewPage/index").then(({ ViewPage }) => ({
default: ViewPage,
}))
);그럼 답변이 도움되셨길 바라며, 강의에 관심을 가져주셔서 감사합니다. :)