이것저것 코딩공부

에러메세지/경고메세지 기록

김쨔뿌 2022. 4. 5. 18:22

*에러메세지 그대로..기록

파파고 돌리면 원인 알 수 있는거 

* 여기 있는 걸로 검색해서 들어오셨다면 파파고 먼저 돌리는 습관을 가져봅쉬다 

 

Image elements must have an alt prop, either with meaningful text, or an empty string for decorative images.

- <Image /> 에 alt를 안넣어서 뜨는 것. <Image alt="어떤 이미지인지 설명하는 메세지를 넣어주세요"/> 

이거 왜 넣냐면 예를 들어 시각장애인이 프로그램으로 html을 긁어서 들을 때 이미지는 alt 태그의 내용을 읽거나 이미지가 깨졌을 때 이 이미지가 어떤 이미지인지 비장애인에게도 알려줄 수 있음!! 

만약 html 에 이미지 태그가 아니라 svg로 버튼을 만들었다면 버튼 안에 텍스트로 이게 무슨 버튼인지 적어주는게 좋음.

별 의미없는 배경이면 안해도 될 듯. 그치만 겁나 간지나고 이걸 못보는 누군가에게 이게 무슨 배경인지 설명해주고싶다면 적어주고 텍스트를 css로 날려버리면 될듯 ㅎ

 

img elements must have an alt prop, either with meaningful text, or an empty string for decorative images.

- 위랑 동일. 근데 Next.js 에서 쓰는 <Image/> 말고 <img/> 에서 발생하는 경고

 

passHref is missing. See: https://nextjs.org/docs/messages/link-passhref

- <Link> 에게 자식태그가 있는데 <Link> 에게 passHref 를 안넣어줘서 뜨는 것.. <Link href="" passHref> 로 수정해주기.

 

에러는 안뜨고 크게 상관은 없지만..

* 개인적으로 이런건 안했으면 하는 것

 

Next.js 에서 제공되는 <Link> 나 <Image> 처럼 이미 이름이 있는 애랑 똑같은 명칭의 컴포넌트를 만들거나 styled-components 로 똑같은 이름으로 새로 만들기

- 별 생각 없었는데 다른 분이 이렇게 짜놓으신걸 처음 봤을때 당연히 Next.js 에서 제공하는걸 사용하신 줄 알았다.. 하지만 그냥 styled-components 이름이었던. 이왕이면 알아보기 쉽게 하는게 좋..겠당.