inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

Slack 클론 코딩[실시간 채팅 with React]

@types/loadable__component module not found error 도와주시면 감사하겠습니다.!

해결된 질문

572

dadsdwdadsda

작성한 질문수 1

1

에러해결 시도현황

(하단에 npm list 첨부했습니다.)

생각한 원인

node_moduels\@loadable\component 의 경로로 탐색을 하는 상황인데 npm i @types/loadable__component 결과로 다운받은 모듈의 위치는 @types 디렉토리아래 존재하는 상황이므로 노드가 경로를 못찾나? 라고 생각했습니다.

=> 첫 시도

에러 상황: module not fount 상황으로 @types directory 를 찾지 못해 생긴 문제로 생각했습니다.

=> @types 를 추가해 경로를 고쳐봤습니다.

마우스를 올리면 이런식으로 나오는데, 브라우저에서는 module not found 가 나옵니다.

=> 두 번째 시도

에러 추론.. webpack 문제?

잘은 모르지만, webpack config에 @loadable 을 추가해봐도 해결이 안됩니다.

=> @loadable 이 없는 상황에도 에러가 납니다.

=> @loadbale resolve argument 로, (__dirname, '@types') 에러납니다. (import loadable from '@loadable/component' 상황입니다.)

 

=> @loadable resolve argument 로, (__dirname, '@types/loadable__component') 에러납니다. (import loadable from '@loadable/component' 상황입니다.)

두 번째 시도의 에러 첨부본 모두 vscode 를 재부팅후 npm run dev를 실행한 결과입니다.

 

ref)

=> npm list

 

 

 

 

 

Socket.io typescript socket.io react 웹팩 클론코딩 babel 클론코딩

답변 1

1

제로초(조현영)

npm i @loadable/component 하신 게 맞나요? 제가 봤을 때는 라이브러리를 안 까시고 타입만 설치하신 상황으로 보입니다.

0

dadsdwdadsda

답변 감사드립니다.

npm i @loadable/component 를 했고, 아래와 같은 npm list 결과가 나옵니다. 아직 문제가 해결되지 않아 질문드립니다. 추가적으로 package.json 과 파일구조를 첨부하였으니 도움되셨으면 좋겠습니다.

=> 현재, @loadable/component 라이브러리의 버전은 ^5.15.3 이며, @types/loadable__component 라이브러리는 ^5.13.4 입니다.

  • 에러 메시지 입니다.

image

 

  • install 이후 npm list 의 결과값입니다. (vscode 재부팅 한 후 입니다.)

image

  • install 이후 package.json 캡쳐본입니다.

image

  • 브라우저 개발자 모드입니다.

image

  • 파일구조입니다. image

 

0

dadsdwdadsda

아 죄송합니다! 해결했습니다. 그 전에 건드려 놓은 webpack alias 가 문제였네요!

기본 셋팅과 관련하여

0

92

1

초기 셋팅 back과 front만 남겨두고 다 지운 후 진행 방법

0

96

2

focus 시에만 화면 업데이트 되는 이유 + 해결방법

0

150

2

useEffect 개수 관리

0

110

2

라이브러리 서치 방법

0

104

2

함수 정의 패턴

0

77

1

npm run dev 에러

0

152

3

npx webpack 후 에러

0

178

2

'void' 형식 식의 truthiness를 테스트할 수 없습니다.ts(1345)

0

144

2

사용자 가입시 에러발생 (TypeError: Cannot read properties of null (reading 'addMembers')

1

178

2

초기세팅중 packge.json 에러떠요

0

156

2

CORS - Access-Control-Allow-Origin 누락 문제

0

431

3

로그인 페이지 무한 새로고침 현상

0

598

2

Module not found: Error: Can't resolve './App' 에러

0

959

1

배포 방법

0

298

2

npm run dev 시 빌드가 매우 느려졌습니다

0

990

2

alias 경로 설정 오류

0

452

2

fetcher 함수의 data 값이 두번 찍히는 이유

0

278

1

제네릭 질문

0

218

2

ts-node 대신 tsx 사용여부

0

373

1

배포 관련 질문

0

247

1

[nginx + https] 서비스를 실행하면 niginx가 아닌 서비스 화면을 보여주게 하고 싶습니다.

0

385

2

[배포하기] webpack에 aws 퍼블릭 IPv4 주소 와 포트 주소를 작성하고 나서 빌드후 실행하면 오류가 발생합니다.

0

336

1

users 호출 시 쿠키가 담기지 않는 이슈 질문드립니다.

0

247

2