Inline SVGs not rendering and break page

🐛 Bug Report

This may be user error, as I feel like this is core enough that it would have already been reported, so I apologize if I waste anyone’s time.

Have you read the Contributing Guidelines on issues?

Yes

To Reproduce

1. npx @docusaurus/init@next init my-website classic
2. Add the following to the top of mdx.md:

import Mountain from '@site/static/img/undraw_docusaurus_mountain.svg';

A mountain:
<Mountain />

1. Go to http://localhost:3000/docs/mdx The page should be broken and the following error should be in the developer panel: DOMException: Failed to execute 'createElement' on 'Document': The tag name provided ('/assetsundraw_docusaurus_mountain-b480421ae597bc5783ec62d605645b24.svg') is not a valid name.

I want to add that I also tried including the svg in an external component file with the same results

Your Environment

This was done with the most recent version of docusaurus

Reproducible Demo

I’m not including a link because the steps to reproduce from scratch are so quick. Hopefully that’s ok!

[slorber]

Hmmmm, I didn’t know we had that!

Need to check this next week, but I can confirm I see this webpack loader:

        {
          test: /\.svg$/,
          use: '@svgr/webpack?-prettier-svgo,+titleProp,+ref![path]',
        },

[oriooctopus]

Thank you @slorber !