[Next.js] Its return type 'Promise<Element>' is not a valid JSX element. 에

 

 

'YouMayLike' cannot be used as a JSX component.
Its return type 'Promise<Element>' is not a valid JSX element.
Type 'Promise<Element>' is missing the following properties from type 'ReactElement<any, any>': type, props, keyts(2786)

 

 

서버컴포넌트에서 async키워드를 사용하였을 때 나오는 에러 메시지

 

방법1

에러가 나는 코드위에 다음 키워드 추가:

{/* @ts-expect-error Server Component */}

 

 

 

 

방법2

export const YouMayLike = async () => {
  return (
    <>
		//jsx코드
    </>
  ) as unknown as JSX.Element;

 

 

 

화살표 함수로 변경 후 as unknown as JSX.Element 추가