[React] Window & typeof globalThis' 형식에 'apple' 속성이 없습니다 ERR

NextJS & Typescript 환경에서 애플 로그인을 연결하며, 몇 가지 문제와 마주했다. 

 

우선 첫 번째로 react-apple-login 라이브러리를 사용했는데, 연결은 잘 됐지만 의존성 문제가 발생하여 배포가 안 되는 이슈가 있었다. 따라서 다른 라이브러리를 찾아봤다. 

 

두 번째로 react-apple-signin-auth라는 라이브러리가 있어 사용해봤다. 해당 라이브러리는 타입스크립트를 사용하는 부분에서 문제가 있어 사용하지 못했다. 

 

결국 라이브러리를 사용하지 않고 애플 공식 홈페이지에 있는 개발자 문서를 보며 react에 맞춰 적용하기로 결정했다.. 

 

Typescript를 사용하며, 기존에 없는 window객체의 값에 접근하려 했을 때 Window & typeof globalThis 에러가 발생했다. 

 

역시 Sciprt로 애플 API를 넣어줬지만, 기존에 없던 window객체의 속성이기에 

 

 

 

Window & typeof globalThis' 형식에 'apple' 속성이 없습니다 ERR

 

해당 에러가 발생했다. 

 

해결 방법은 의외로 간단했다. 여러가지 방법이 있겠지만, 나는 

 

 async function init() {
    //@ts-ignore
    window.AppleID.auth.init({
      clientId: '[CLIENT_ID]',
      scope: '[SCOPES]',
      redirectURI: '[REDIRECT_URI]',
      state: '[STATE]',
      nonce: '[NONCE]',
      usePopup: true
    })
  }

위와 같이

//@ts-ignore 

 

한 줄을 추가해주어 해결할 수 있었다.