Kakao is not defined

지도/로컬 API
1

안녕하세요
도움을 구하고 싶어서 글을 남깁니다. 저는 리액트(vite)와 타입스크립트를 사용하고 있으며,
현재 Kakao Maps API를 활용하려고 합니다.
필요한 코드를 추가했음에도 불구하고 에러가 발생하고 있습니다.
혹시 제가 놓친 부분이나 개선할 수 있는 방법이 있다면 알려주시면 감사하겠습니다.

index.html

 <script
      type="text/javascript"
      src="https://dapi.kakao.com/v2/maps/sdk.js?appkey=키&libraries=services,clusterer"
    ></script>

body아래 또는 head에 옮기 면서 추가를 해 보았으나 에러가 납니다.

npm i react-kakao-maps-sdk 설치를 하였고

const geocoder = new kakao.maps.services.Geocoder();
const coord = new kakao.maps.LatLng(latitude, longitude);

이 코드에서
kakao is not defined 에러가 나고

const { kakao } = window;를 추가 하면
mapis not defined 에러가 납니다.

도움 부탁드립니다.

2

@senefull

안녕하세요,

리엑트 SDK 는 당사가 배포한 것이 아니므로
해당 SDK 사용 시 발생하는 문제에 대해서는 도움을 드리기 어렵습니다.

지도 스크립트가 정상적으로 인증 되었는 지 확인해보세요.

3

혹시 몰라서 sdk를 설치를 하였고

리액트에서 현재 확인이 안됩니다
const geocoder = new kakao.maps.services.Geocoder();
const coord = new kakao.maps.LatLng(latitude, longitude);
둘줄의 코드는
https://apis.map.kakao.com/web/documentation/#services_Geocoder
에 있는 걸 사용 하였습니다

html파일에서 지도 스크립트는 정상 적으로 되는 것을 확인 했습니다
https://dapi.kakao.com/v2/maps/sdk.js?appkey=키&libraries=services 를 넣어서 확인 했습니다.

4

@senefull

지도 스크립트가 정상적으로 된다고 하셨는데요,
호출 기록 상으로는 domain mismatch 오류가 다수 발생한 것으로 보입니다.