본문 바로가기

전체 글46

next.js app라우터에서 useId 사용시 발생하는 hydration 에러 Hydration mismatch when using the useId hook, when using the app router https://github.com/vercel/next.js/issues/53110 위 게시물에 자세하게 나와있었다. 요약하자면 next에 여러 PR이 합쳐지면서 ReactDevOverlay가 여러 개 생겼고, 서로 다른 React 트리를 생성하여 useId 차이가 발생하고 있다는 것이었다. next를 최신버전으로 업그레이드하자 위 에러로그는 더 이상 발생하지 않았다. yarn berry를 사용하면서 기존 yarn classic과 달라진 명령어가 매번 헷갈렸는데 아래 링크에 자세하게 나와있었다. https://yarnpkg.com/cli/up 특정 dependencies를 업그.. 2023. 9. 29.
Error: Rendered more hooks than during the previous render. ref 코드를 상단으로 올리자 에러가 발생하지 않았다. 2023. 9. 21.
Warning: Cannot update a component (`*`) while rendering a different component (`*`). To locate the bad setState() call inside `*`, follow the stack trace as described in Warning: Cannot update a component (`Router`) while rendering a different component (`SearchContainer`). To locate the bad setState() call inside `SearchContainer`, follow the stack trace as described in https://reactjs.org/link/setstate-in-render 아래와 같이 되어있는 코드를 router.replace(pathname + "?" + queryString); useEffect를 사용하여 해결하였다. useEffect(() => { router.replace(pathname + "?" + queryString); }.. 2023. 9. 20.
~모듈에 내보낸 멤버 ~이(가) 없습니다.ts(2305) No exported member 'css' in module 'styled-components ts(2305) '"styled-components"'모듈에 내보낸 멤버 'css'이(가) 없습니다.ts(2305) 먼저 @types/styled-components를 package.json에 있는지 확인해봤다. @types/styled-components 추가해주고 다시 확인해봤지만 에러는 그대로였다. styled-components를 제대로 불러오고 있는지 확인해봤다. 해당 라이브러리가 아니라styled-components.d.ts파일을 가리키고 있었다. 라이브러리 이름과 파일명이 일치하고 있다는 것을 깨달았다. 파일명을 styled.d.ts로 바꾸고, yarn 명령어 입력 후 다시 확인했다. yarn s.. 2023. 9. 16.
Typescript Can't be found in the cache and wil 버셀을 이용하여 서비스를 배포하던 중 다음과 같은 에러가 나타났다. error: Command failed with exit code 1.Error: Command "yarn install" exited with 1 로컬에서 해당 에러를 재현해 보기 위해 yarn install을 시도해 보았다.  모노레포에서 타입스크립트를 사용하던 중 충돌이 발생한 것 같다. yarn.lock 파일을 삭제하고, `yarn cache clean` 커맨드를 입력 후 다시 yarn install 해주었다. https://learn-dev.tistory.com/9 위 블로그를 통해 yarn 3.3.0 버전과 타입스크립트 4.9.4 이후 버전의 이슈가 있다는 것을 알게 됐다. 모든 워크스페이스의 타입스크립트 버전을 4.9.3 버.. 2023. 8. 28.
모노레포에서 Typescript 사용중 발생한 vscode 에러 어느 날 갑자기 vscode에서 아래와 같은 에러가 발생했다. The JS/TS language service immediately crashed 5 times. The service will not be restarted. This may be caused by a plugin contributed by one of these extensions: styled-components.vscode-styled-components. Please try disabling these extensions before filing an issue against VS Code.This workspace contains a TypeScript version. Would you like to use the workspac.. 2023. 8. 20.