default export가 아닌 named export일 때 lazy사용법
ListPage컴포넌트가
export default ListPage가 아니라
const ListPage = () => { ... }
export {ListPage}
처럼 한 경우에는 어떻게 import 해야 하나요?
Answer 1
1
안녕하세요, 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,
}))
);그럼 답변이 도움되셨길 바라며, 강의에 관심을 가져주셔서 감사합니다. :)
bundle analyzer 에 대한 질문이 있습니다.
0
108
2
Cannot find module serve 에러
1
104
1
성능 탭에서 소요시간이 안보입니다
0
205
2
이미지 CDN 만드는 방법
0
459
1
Performance FPS 탭이 안보여요.
1
798
1
CPU throttling이 뭔가요?
0
1119
1
lazy적용하였는데 네트워크탭에 분리하여 보이지 않습니다
1
583
1
network 캐싱에 대해서 질문 있습니다!
1
427
1
vue project에서 chrome performance tab 확인하기
1
458
1
node version으로 인한 오류
4
1232
1
강의 자막
1
956
2
번들파일과 병목현상 질문
2
396
1
webpack-bundle-analyzer 질문
1
786
1
이미지 프리로딩 질문
1
385
1
이미지 최적화 활용
1
582
1
강력 새로고침
1
323
1
Suspense 관련해서 질문드립니다
2
360
1
config-overrides cant resolve path
1
362
1
이미지 preload 컴포넌트 preload 차이 질문드립니다.
1
611
1
custom react 환경에서 node_modules chunk 분리
1
381
1
removeSpeical 함수를 줄여야겠다고 하는 이유!
1
283
1
Factory pattern에 대해서 궁금한 점이 있습니다
2
367
2
텍스트 압축 방식에 대해 질문이 있습니다
2
952
1
최적화에 대해서 질문있습니다~~
1
344
1