[React] 나는 왜 오류가 나는가 (feat. logo192.json, smartFarmData.json 오류)

밥슌·2024년 8월 21일
0

React

목록 보기
3/16

지금 오류의 주요 원인은 여전히 logo192.pngsmartFarmData.json 파일을 찾지 못하기 때문입니다. 이 문제를 해결하기 위해 몇 가지 확인 사항과 수정 방법을 안내드리겠습니다.

1. logo192.png 오류 해결

manifest.json 파일에서 logo192.png에 대한 참조를 제거했지만, 여전히 index.html이나 다른 파일에서 이 파일에 대한 참조가 남아있을 수 있습니다.

  • index.html이나 public 폴더의 다른 파일에서 logo192.png에 대한 참조를 다시 한 번 확인하세요.
  • 또한, React 앱 내부에서 logo192.png가 사용되지 않도록 전체 프로젝트 파일을 검색해보세요.

만약 logo192.png를 제거했는데도 오류가 발생한다면, manifest.json에서 해당 부분을 완전히 제거했는지 다시 확인해보세요.

2. smartFarmData.json 오류 해결

smartFarmData.json 파일이 404 오류를 일으키는 원인은 경로 문제일 수 있습니다.

  • smartFarmData.json 파일이 실제로 public/data 디렉토리에 있는지 확인하세요.

  • Dashboard.js 파일에서 smartFarmData.json을 불러오는 코드가 다음과 같이 되어 있을 겁니다:

    fetch('/data/smartFarmData.json')

    이 경로가 맞는지 확인하세요. 상대 경로와 절대 경로에 유의하세요.

    만약 mini_dashboard 브랜치의 깃허브 페이지를 사용 중이라면, 브랜치의 루트 URL에 맞춰 경로를 다음과 같이 조정해 보세요:

    fetch(`${process.env.PUBLIC_URL}/data/smartFarmData.json`)

3. 여전히 404 오류가 나는 경우

GitHub Pages에서 favicon.ico, manifest.json과 같은 파일을 찾지 못하는 문제가 지속된다면:

  • build 디렉토리의 구조가 올바른지 확인하고, favicon.ico, manifest.json 등이 올바른 경로에 위치하고 있는지 확인하세요.
  • build 디렉토리를 직접 확인해서 해당 파일들이 build 폴더 내에 올바른 위치에 존재하는지, 그리고 GitHub Pages에서 접근 가능한지 확인합니다.

마지막으로, 변경 사항을 모두 커밋하고 npm run deploy 명령어를 다시 실행해 GitHub Pages에 배포해 보세요. 그런 다음 페이지를 새로고침해 문제가 해결되었는지 확인해 보세요.

profile
마트 시식코너같은 저의 벨로그에 어서오세요.

0개의 댓글