본문 바로가기

FE/error4

[TypeScript] error 2322: React Prop 전달 시 IntrinsicAttributes 타입 에러 에러 메세지 BoardMain 라는 부모 컴포넌트에서 PostList라는 자식 컴포넌트에 filterProp을 넘기고 싶은 상황입니다. PostList에서는 다음처럼 filterProp인수를 받아 사용하고 있습니다. (설명에 필요하지 않은 코드는 생략하였습니다.) // PostList.tsx export default function PostList(filterProp: IFilter) { const { data, isLoading } = useInfiniteQuery( ['articles', filterProp.filterProp], ({ pageParam = 1 }) => getArticles(filterProp.filterProp, { pageParam })); return } 에러 원인 문제는 위.. 2023. 4. 27.
[git] git 파일명 대소문자 구분 error 문제 상황 수정된 파일이 있는데 그게 내 컴퓨터에는 없는 파일이고, add도 안되다보니 commit도 안되고, discard해도 삭제되지도 않고... 변경사항이 있다고 +4 가 떠서 안지워지고.... 한 이틀 끙끙거리다가 다른 작업들이 밀려 흐린눈하고 못본척 해온게 벌써 2주 전...; 그러다가 백엔드 개발자분이 프론트 한번 확인해보신다고 해서 받으셨는데 같은 오류가 나는것이다. 나는 로컬 깃쪽에 문제가 생겼나했었는데 백엔드개발자 분한테까지 문제가 생겼다니 모른척할 수도 없고 거의 2주만에 다시 이 문제를 마주 보게 되었다... discard를 하면 좌에서 우로 바뀌는 기묘한 현상....처음엔 뭐가 바뀌는지도 모르고 그냥 삭제가 안된다고 생각했는데, 그게아니라 Board->board로 svg파일이름이 바.. 2023. 4. 14.
[Typescript] error 2362: The right-hand side of an arithmetic operation must be of type 'any', 'number', 'bigint' or an enum type. 에러 메세지 에러 원인 const diffSeconds = (currentTime - createdTime) / 1000; 게시판에서 글작성 시간과 현재 시간을 비교해서 '몇 시간전, 방금 전' 등을 출력하는 함수를 작성중이었습니다. 위 코드에서 currentTime과 createdTime은 Date 타입인데, 타입스크립트에서 ' - ' 연산은 any, number, bigint만 가능하다는 겁니다. 즉 any, number, bigint 이외의 타입을 산술연산자(+, -, *, / 등)를 이용해 연산하려고 할 경우 위와 같은 에러가 발생합니다. 해결 방법 그렇다고 Date 타입을 any로 바꿀 수는 없으니 다른 방법을 고려해보아야합니다. 이럴 때 유용하게 사용할 수 있는 것이 valueOf() 함수입니.. 2023. 3. 13.
[Typescript] error 2786 : 'Component' cannot be used as a JSX component. 에러 메세지 에러 원인 에러를 읽어보면 return type이 'false | Element'로 되어있었습니다. 다른 컴포넌트를 확인해보니 JSX.Element를 반환하고 있었습니다. 그래서 문제의 컴포넌트의 return을 살펴보았는데 아래 코드처럼 return () 안에 태그없이 코드를 작성했습니다. react 컴포넌트에서 Return 값은 항상 하나의 태그로 묶여져 있어야합니다. 저같은 경우는 앞에 변수를 추가하면서 오류가 발생한 상황입니다! return ( showHeader() && ( {showBackBtn() ? ( ) : null} {setPageTitle()} ) ); ** 참고로 해당 오류는 @types/react의 버전문제 때문에도 발생할 수 있다고 합니다. 컴포넌트 return에 문제.. 2023. 2. 21.