본문 바로가기
728x90
728x90

이슈관리11

Expression produces a union type that is too complex to represent.ts(2590) 오류 Expression produces a union type that is too complex to represent.ts(2590) 오류 문제 상황 ⚠️Expression produces a union type that is too complex to represent.ts 타입스크립트 환경에서 chakra ui를 사용하는 중에 발생한 오류이다. 코드 자체에서는 오류가 없었고 검색해보니까 타입스크립트의 버전 문제였다. vscode extension에서 사용하는 타입스크립트 버전은 5버전이었고 프로젝트에서는 4버전을 사용하고 있었다. vs코드에서 F1을 누르고 typescript를 입력하면 Select Typescript Version에서 사용중인 타입스크립트 버전을 확인할 수 있다. vscode 설정에.. 2023. 12. 9.
netlify Build script returned non-zero exit code 2 오류 netlify Build script returned non-zero exit code 2 오류 문제 상황 ⚠️Build script returned non-zero exit code 2 기존에 netlify 배포중인 프로젝트의 main branch에 push했고 변경사항이 반영되지 않아서 netlify에 접속해서 확인해보니 위와 같은 오류가 발생했다. 코드 자체에서는 오류가 없었고 검색해보니까 빌드 디렉토리 설정의 오류라고 한다. 그래서 Build setting에서 Build Command도 CI = npm run build로 변경해보고 publish directory도 변경해봤지만 오류는 그대로 발생했다. 잘못된 코드 Build setting을 변경하고 여러번 빌드를 해보니 기존 오류가 아닌 새로운 .. 2023. 6. 6.
리액트 결측치 처리 리액트 결측치 처리 문제 상황 react에서 무한 스크롤 구현 후 테스트 중 특정 포켓몬 번호에서 api호출을 계속 요청하고 응답을 받지 못해 스크롤이 내려가지 않았다. 크롬의 네트워크 탭에 요청 결과를 확인해보았다. 테오시스라는 포켓몬에 대한 요청을 처리하지 못해서 나머지 item들도 불러올 수 없었다. 잘못된 코드 api를 보면 포켓몬 이름 목록을 불러온 후 이름들로 포켓몬 상세 정보를 요청하는 구조이다. 포켓몬 사진과 타입을 활용하기 위해서 pokemon, species라는 api resource 2개를 사용한다. 테오시스라는 포켓몬에 대해서 pokemon resource를 요청할 때는 'https://pokeapi.co/api/v2/pokemon/deoxys-normal'로 요청하고 species.. 2023. 6. 2.
리액트 Encountered two children with the same key 리액트 Encountered two children with the same key 문제 상황 react에서 무한 스크롤 구현 후 api 호출 마다 리스트에 아이템을 추가하는 과정에서 다음과 같은 오류가 발생하였다. list의 item들이 렌더링은 정상적으로 되었으나 콘솔에서 오류가 발생하였다. ⚠️Warning: Encountered two children with the same key, 잘못된 코드 key가 중복되서 생기는 문제라는 것을 직관적으로 파악할 수 있었는데 key관련 코드들을 모두 수정해보았지만 해결하지 못했다. item의 key인 서버로 부터 받아온 id값을 출력해보니 한번 렌더링할 때 중복되는 것은 아니고 api를 다시 호출 할때 기존 key와 중복되는 것 같다. 스크롤의 길이를 보니.. 2023. 6. 1.
728x90
728x90