Next.js Link 하위에 컴포넌트가 들어갔을 때,

Hyunwoo Seo·2022년 8월 22일
0

Next.js

목록 보기
6/7
post-thumbnail

Next.js 에서 Link 는 꼭 써야하는 컴포넌트다.

<Link> 에서는 href 속성이 중요하다.

일반적으로, <Link> 하위에 텍스트만 넣어도 <a> 태그가 자동으로 생성된다.

그렇다면 하위에 컴포넌트가 들어갔을 땐 어떻게 될까?

기능상의 문제는 없다.

개발자도구상으로 확인했을 때도 a 태그와 href 는 없지만, 페이지 이동도 잘한다.

하지만 이러한 경우, 검색엔진이 href 속성을 추적할 수 없으니, 페이지 컨텐츠를 인덱싱 할 수 없고, 그러니 SEO 에 안좋을 수 밖에 없다.

이를 해결하려면, <Link>passHref 를 꼭 넣어주자.

개발자도구를 확인하면 없던 href 속성이 생긴것을 확인할 수 있다!

0개의 댓글