next.js dynamic import 질문

Question

안녕햐세요 제로초님 현재 상황이 storage 관련 유틸함수를 따로 파일로 만들어 utils/storage에 모듈화를 해놧습니다. 허나 import를 하게 되면 window.is not defined 또는 localStorage is not defined라고 에러가 뜨는데 제가 하고싶은건 해당 import를 csr일때 호출시키고싶은데 검색해보니 dynamic import라는게 있는데 이건 컴포넌트 파일만 해당되는것같더라구요 const s torage = dynamic (() => import ( "@utils/storage" ), { ssr : false , }); 위와같이 사용을 해보았지만 아래와 같은 에러가 뜨고 있습니다.(ts 사용중입니다.) 형식의 인수는 'DynamicOptions<{}> | Loader<{}>' 형식의 매개 변수에 할당될 수 없습니다. 형식에 없지만 '{ default: ComponentType<{}>; }' 형식에서 필수입니다. ts(2345) 현재 useEffect에서 const storage = require('@utils/storage)" 이렇게 불러오는 코드를 짜서 에러를 해결하긴 했지만 올바른 방법은 아닌거같아 질문드립니다. 컴포넌트가 아닌 모듈을 CSR일때 import 할수 있는 방법이 있는지 궁금합니다!

제로초(조현영) · Answer

dynamic을 보니까 컴포넌트가 아니어도 쓸 수 있을 걸로 보이는데요. 타입스크립트에서 제약이 걸려있는 것 아닌가 생각이 드네요. 일단 window is not defined나 localstorage is not defined는 코드를 if (typeof window !== 'undefined') 등으로 감싸시면 됩니다.