Next.js에서 Window가 정의되지 않았다는 괴상한 이슈
원래부터 알고 있는 용법이었는데, 이를 왜 사용하는지 궁금했었다.
왜냐하면, 기존 style로 대체할 수 있지 않을까라는 생각 때문이었다.
그러나 이는 내 오산이었다.
실제로 style의 경우는 인라인으로 스타일이 지정되어 우선순위가 꼬이게 된다.
그러나 css로 지정할 경우는 인라인으로 스타일이 지정되는 게 아니라, 컴포넌트 단위로 css가 css-in-js 형태로 지정이 된다.
따라서 우선순위가 꼬이지 않는다.
푸름 햄과 오늘 간단히 개발 얘기를 하다가 흥미로운 얘기를 들었다.
SSG로 작업을 하던 중, window에 대한 객체 정의가 되어 있지 않다는 에러가 발생했다는 것.
그래서 이에 대한 궁금증이 생겨 검색을 해보니... 다음과 같았다.
SSG에서는 서버에 데이터를 캐싱하여, 결과적으로 하나의 문서 파일을 저장해둔다.
그런데... 이는 서버에서 window가 아닌 global을 쓰기 때문에 오류가 발생하는 것이다.
따라서... 이를 오류가 안나도록 지정해주려면, window라는 게 마운트가 될 때에만 호출될 수 있도록 좀 더 세부적인 라이프사이클을 설정해주어야 한다는 것.