프로젝트를 진행하며 카카오 로그인을 구현함에 있어 발생한 이슈를 공유하려고한다.
카카오 로그인시 로고이미지가 특정 페이지에서 깨지는 현상이 발생하였다.
간단하게 경로를 바꾸고 컴포넌트화 시켜 해결 할 수 있었다.
원래 이미지파일을 public 파일에 위치시켰었는데, src폴더에 assets라는 폴더를 생성하여 이곳으로 이동시켰다. 그리고 이 이미지를 사용하는 컴포넌트에서
/KakaoLogin.js
import {Logo} from 'assets/logo.png'
<img src={Logo} >
이와 같이 변경해주었다.
이미지가 깨지는 오류를 이렇게 해결 할 수 있었다. 절대경로를 사용했으니 안된다면 절대경로로 바꾸어보시길 바란다.