Warning: Invalid DOM property `%s`. Did you mean `%s`?%s
에러
리액트 + 테일윈드에서 외부사이트 svg 아이콘을 적용해서 사용하는데 콘솔에서 다음과 같이 에러가 나왔다.
당시 내가 사용했던 svg 아이콘
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-6 w-6"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
strokeWidth="2"
>
<path
className="text-purple-300"
strokeLinecap="round"
strokeLinejoin="round"
d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"
/>
</svg>
해결
react 에서 tailwind를 사용할 때에는 class
가 아니라 className
으로 사용해야 하는데 확인하지 않고 적용만 하고 지나가버려서 위와 같은 에러가 나왔던 것.
그 외에도 자바스크립트에서의 스네이크 표기법을 따르지 않았을 경우에도
Warning: Invalid DOM property `%s`. Did you mean `%s`?%s
같은 오류가 콘솔에 뜰 수가 있다.
( 예를 들면 stroke-linecap
=>strokeLinecap
으로 고쳐야 함 )
Author And Source
이 문제에 관하여(Warning: Invalid DOM property `%s`. Did you mean `%s`?%s), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@jinsunkimdev/Warning-Invalid-DOM-property-s.-Did-you-mean-ss저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)