react 18로 업글시 children 타입에러 : Type '{ children: Element; }' has no properties in common with type 'IntrinsicAttributes'.

https://morioh.com/p/7cdc9d7c930e

구글에 react.fc를 검색하면 react.fc를 쓰지 말라는 글이 많다. (react.fc 축구팀 같기도..)

 

react.fc의 타입에 children을 옵셔널로 포함하기 때문에 , children이 들어가지 않아야 할 상황을 잡지 못하는 이유에서이다.

 

이는 react 18 이전까지의 이야기다.

 

react,react-dom,@types/react-dom을 업그레이드 하자 children에러가 나타났다.

Type '{ children: Element; }' has no properties in common with type 'IntrinsicAttributes'.

 

이제 react 18에서는 컴포넌트의 타입에 children을 포함하지 않는다.

그래서 children을 별도 타입지정해주지 않으면 '야 children들어가면 안되는곳에 children 들어갔어!' 라고 알려주게 된다.

 

해결책은 간단하다.

 

React.PropsWithChildren을 넣어주면 된다.

 

---

참고

react 18 업글시 주의사항