react-Fullpage 삽질 정리

JS2L·2023년 10월 30일

오늘도 프로젝트에 어떤걸 추가해야 더 이뻐보일까 고민하던중 전부터 해보고 싶었던 풀페이지 스크롤(Fullpage)를 구현해보고 싶었다.
하지만 그냥 내가 구현하기에는 시간이 부족해 라이브러리를 찾아보던 중 fullpage.js가 많이 쓰이지만 결제가 필요하기에 npm에 같은 기능을 가진 react-fullpage를 발견해서 사용해보려고 했다.

npm install --save react-fullpage

사실 이 라이브러리 전에 react-full-page (중간에 하이픈하나 더 있음)을 사용 해보려고 받았는데 리액트 18버전에서 지원을 하지않고 타입스크립트 지원초자 없었기 때문에 몇번 삽질해보다가 성공은 했지만 vercel에서 빌드과정에서 에러가 떠서 깔끔하게 버렸다.

이것 또한 타입스크립트 오류가 있지만 지인이 사용했던 경험이 있어 질문하면서 타입지정을 해주려는데 지인이 바빠서 답이 오질 않았다...

그래서 결론적으로 내가 찾은 답은 node_modules에서 react-fullpage를 찾아 index.d.ts로 타입지정을 해줘도 된다만 이걸하기에는 정보가 너무 턱없이 부족했고 다른 방법을 찾아보던중 react-app-env.d.ts에 declare module "react-fullpage";을 추가해주면 된다는 글을 보게 되었는데
'아니 이게 타입지정없이 그냥 모듈지정만 해줘도 되는건가?' 싶었지만 일단 해봐야 알기때문에 해보았다.

오?! 깔끔하게 오류해결

솔직히 기대 안했는데 타입스크립트 지원안해주는 라이브러리를 이렇게 한줄 추가해서 사용했다는게 믿기지 않았다.
그 블로그 제외하고 다른 블로그 심지어 GPT조차 index.d.ts에 타입지정을 해줘야 한다고 하더니... 이렇게 간단하게 해결될 줄이야

profile
신입 개발자의 독고다이 개발일지

0개의 댓글