🔥 트러블슈팅

자바스크립트로 스톱워치를 구현할 때, setIntervel을 사용하면 안 된다. setIntervel은 일정한 시간 간격마다 동일한 콜백을 실행하는 함수이다.

Next.js 환경에서 전역상태라이브러리 zustand를 사용하고 있었다.전역 상태를 사용해야 하면서, 새로 고침 후에도 값이 남아 있도록 스토리지에 값을 저장해야했다.

React + typescript 환경에서 emotion.js 라이브러리를 사용하려고 환경을 세팅중 두가지 에러가 발생하였다.

Error: Hydration failed because the initial UI does not match what was rendered on the server.

Error: NextRouter was not mounted 에러 해결하기

html2canvas 라이브러리를 이용해서 DOM을 이미지로 다운받을 수 있다. 그런데 이 과정에서 이미지의 해상도가 깨지는 문제가 발생한다. 이는 이미지의 크기를 더 키우는 방식으로 해결할 수 있다.

전형적인 Hydration error가 발생하였다. 내가 실행하는 환경은 Next.js로 SSR이 가능하기 때문에 처음 코드가 실행될 때 client side가 아닌 server side에서 실행될 수도 있다.

Error: appWithTranslation was called without a next-i18next config 해결

Error: You are passing a wrong module! Please check the object you are passing to i18next.use()

Error: i18next::translator: key "xxx" for namespace "translation" won't get resolved as namespace was not yet loaded

'Story'은(는) 사용되지 않습니다. ts(6385)

React 17에서 18로 버전을 업그레이드하면서 예상치 못한 라우팅 문제가 발생했습니다.