Module not found: Can't resolve './public/animation.json' issue

[minsing-jin]

lottie files의 animation image를 불러오는 과정에서 오류

애니메이션 시간대: https://youtu.be/KvoFvmu5eRo?t=2834

이 링크에서 참고해도 원인을 파악하지 못하겠음 https://nextjs.org/docs/messages/module-not-found

[minsing-jin]

lottie file player의 파일이 잘 작동이 안되는 이슈였음.

https://stackoverflow.com/questions/64936044/fix-the-upstream-dependency-conflict-installing-npm-packages

npm install --save react-lottie-player 요녀석을 프로젝트 폴더에 npm install을 했어야했음.

[minsing-jin]

help!

Trouble Situation

lottie files의 animation image를 불러오려고 했지만 자꾸 모듈이 없다고 합니다.

그래서 위에 리눅스에서 module-not-found일때 참고해보라는 next js 공식문서 사이트를 가서 해결책을 하나하나씩 시도해봤습니다.

(https://nextjs.org/docs/messages/module-not-found#the-module-youre-trying-to-import-is-not-installed-in-your-dependencies)

Trail 1: dependencies에 모듈이 import 제대로 되었는가?(The module you're trying to import is not installed in your dependencies)

-> 영상 메뉴얼에서 볼 수 있듯이 lottie player를 install할 수 있는 github 사이트를 들어가 linux에 react lottie player를 다시 설치했습니다.

(https://github.com/mifi/react-lottie-player)

-> 근데 무슨 3개의 high severity한 vulnerabilities가 있다고 했습니다. 이거 고칠려면 npm audit fix를 하라네요.

-> 그래서 npm audit fix를 했더니 아래 사진처럼 나온다음 npm audit fix로 또 고칠수 있다고 run 하라고 npm audit report에서 그렀다네요. 근데 2~3번 npm audit fix를 해봐도 여전히 3 high severity vulnerabilities issue 발생합니다.

[minsing-jin]

시도 2: 다른 directory에 모듈을 설치

처음에는 project file인 next-port내에 react-lottie-player을 설치하지 못했기 때문에 다시 설치 시도했음. 하지만 next-port의 package.js에 정상적으로 react-lottie-player가 설치되었다는걸 확인했음에도 불구하고 여전히 모듈이 없다는 issue발생

-> 여기서부터는 import한 파일의 경로가 잘못되었나 거듭 확인했지만 파일경로가 틀리거나 오타가 있는건 전혀 없었음.

[minsing-jin]

어떤것이 잘못된것입니까?

[minsing-jin]

http://khunggum.khu.ac.kr/

[minsing-jin]

https://stackoverflow.com/questions/74994928/module-not-found-cant-resolve-public-animation-json-issue-in-next-js-while