TroubleShooting/Next.js (2) 썸네일형 리스트형 [Next.js] svgr/webpack과 vitest를 사용한 SVG 테스트 ( vitest 에서 svg 경로를 못 읽는 이슈 ) 왜 이러는 지 한참을 삽질하다 이렇게 직접 tsx안에 적어주니 통과를 합니다...???? 이 때 깨달았습니다.@svgr/webpack 사용하면 vitest 에서 svg 경로 오류가 생기는구나 하고.... 아예 랜더링에서 막히고 있습니다... 랜더링을 못하니 아예 해당 Hear 컴포넌트 전체를 테스트 할 수가 없어졌는데요모킹으로 넘겨서 테스트 랜터링을 넘겨야겠다고 판단했습니다. 1. vite-plugin-svgr 설치npm install vite-plugin-svgr --save-dev 2. vitest.config.ts 에 vite-plugin-svg 추가// vitest.config.tsimport { defineConfig } from 'vitest/config'import react from .. [Next.js] svg 파일 복붙 사용할 때 주의점 Invalid DOM property `stroke-width`. Did you mean `strokeWidth`?Invalid DOM property `stroke-linecap`. Did you mean `strokeLinecap`?Invalid DOM property `stroke-linejoin`. Did you mean `strokeLinejoin`? jsx, tsx 에서는 캐멀케이스만 된다는 사실을 금새 잊어버렸다....ㅠ부끄럽습니다😌 뷰쟁이의 슬픔.... 잊어버리지 마라고 스스로 공개처형을 하겠습니다.. 이전 1 다음