[오류 모음] Storybook에서 SVG 사용 시 Failed to execute 'createElement' on 'Document': The tag name~~ 오류 해결


[오류 모음] Storybook에서 SVG 사용 시 Failed to execute 'createElement' on 'Document': The tag name~~ 오류 해결

webpack으로 설정한 프로젝트에서 svg를 사용하려니 오류가 나서 "@svgr/webpack" 플러그인을 설치한 후 웹팩 설정을 해 주었다. module: { rules: [ { test: /\.svg$/i, issuer: /\.[jt]sx?$/, use: ['@svgr/webpack'], }, // ... 이후 d.ts에서 타입도 다 지정해주었다. declare module '*.svg' { import React from 'react'; const SVG: React.VFC<React.SVGProps<SVGSVGElement>>; export default SVG; } 로컬 그랬더니 로컬에서는 잘 돌아가는데, 스토리북에서 아래와 같은 문제를 만났다. 로컬에서는 웹팩 설정을 해주어 svg를 잘 읽어오지만, 스토리북에서는 이상하게 경로명으로 읽어오는 상황이었다. 결론부터 이야기하자면 storybook의 main.ts에서 webpackFinal 속성을 수정하여 해결할 수 있었다. ...


#Failedtoexecute #FailedtoexecutecreateElementonDocument #스토리북오류

원문링크 : [오류 모음] Storybook에서 SVG 사용 시 Failed to execute 'createElement' on 'Document': The tag name~~ 오류 해결