[React] Error: Objects are not valid as a React child

Error: Objects are not valid as a React child (found: object with keys {$$typeof, render, attrs, componentStyle, displayName, shouldForwardProp, foldedComponentIds, styledComponentId, target, withComponent, warnTooManyClasses, toString}). If you meant to render a collection of children, use an array instead.

 

 

react를 실행했는데 해당 에러가 나온다면?

 

react child에 무슨 에러가 생긴것이다.

 

다양한 이유가 있겠지만 나같은 경우는 styled-component 사용에서 실수하여 에러가 발생하였다.

const HeaderLink = styled(Link);

export default () => {
	return (
    	<HeaderLink/>
    );
}

 

위 코드의 문제점은 아주 간단하게도

 

const HeaderLink = styled(Link)``;

export default () => {
	return (
    	<HeaderLink/>
    );
}

``를 빼먹고 사용했었다..

 

에러가 저 특정 파트를 가리키지 않고, 전체적인 reactDOM에러를 반환하니 찾기가 어려웠다.