본문 바로가기

NextJS2

SWR 무한스크롤 첫 페이지 재요청, revalidateFirstPage 설정 기준 useSWRInfinite로 무한스크롤을 만들고 더보기를 누르면 새 페이지만 받지 않아요. 네트워크 탭을 보면 1페이지 요청도 매번 같이 찍혀 있어요.버그는 아니고 revalidateFirstPage 옵션 때문이에요. 기본값이 true라서, 목록 캐시가 있는 상태에서 새 페이지를 추가하면 첫 페이지도 다시 요청해요. 요청을 줄이고 싶으면 revalidateFirstPage: false로 바꾸면 돼요.다만 끄면 최신 글이 목록 맨 위에 늦게 반영될 수 있어요. 그래서 끌지 말지는 목록의 성격을 보고 정해야 해요.아래 설명은 SWR 2.5.0 소스(src/infinite/index.ts)를 확인한 범위예요. 이후 버전에서도 동작이 같은지는 확인하지 않았어요.원인: 첫 페이지 재요청 조건SWR 2.5.0 소스.. 2023. 9. 16.
React 환경 변수 설정과 CI 우선순위 CRA 프로젝트에서 .env 값과 배포 결과가 다르면, 빌드 프로세스에 이미 설정된 환경 변수부터 확인해 보세요. 기본 설정에서는 셸이나 CI의 값이 .env보다 우선해요. 또 REACT_APP_ 값은 빌드할 때 브라우저용 코드에 들어가므로, 배포 서버의 설정만 바꿔서는 기존 결과물이 바뀌지 않아요.기존 글에서 CRA의 규칙을 React 전체의 규칙처럼 설명했던 부분과 CI 환경 변수 우선순위를 바로잡았어요. 아래 설명은 react-scripts 5 계열의 기본 환경 변수 로딩 방식을 기준으로 해요.React가 아니라 빌드 도구의 규칙이에요REACT_APP_은 React 자체가 정한 접두사가 아니에요. CRA의 react-scripts가 앱 코드에 공개할 변수를 구분하는 규칙이에요. Vite나 Next... 2023. 6. 2.