Error using SVG as ReactComponent

[karolis-96]

Current Behavior

import { FC } from 'react';

import { ReactComponent as Test } from './utils/bye.svg';

const App: FC = () => (
  <div>
    <Test />
  </div>
);

export default App;

using like this throws error

Expected Behavior

No error and svg icon visible as component in dom

GitHub Repo

No response

Steps to Reproduce

Nx Report

Node   : 21.2.0
OS     : win32-x64
yarn   : 1.22.19

nx (global)        : 18.1.3
nx                 : 18.2.1
@nx/js             : 18.2.1
@nx/jest           : 18.2.1
@nx/linter         : 18.2.1
@nx/eslint         : 18.2.1
@nx/workspace      : 18.2.1
@nx/devkit         : 18.2.1
@nx/eslint-plugin  : 18.2.1
@nx/react          : 18.2.1
@nrwl/tao          : 18.2.1
@nx/web            : 18.2.1
typescript         : 5.4.3
---------------------------------------
Community plugins:
@nx/rspack : 18.0.6

Failure Logs

ERROR in ./apps/insight/src/utils/bye.svg
  × Module parse failed:
  ╰─▶   × JavaScript parsing error: Expected ';', '}' or <eof>
         ╭─[1:1]
       1 │ <svg width="14" height="16" viewBox="0 0 14 16" fill="none" xmlns="http://www.w3.org/2000/svg">
         ·      ─────
       2 │ <path d="M14 9.00067H10.0004V1.08016e-05H4.00096V9.00067H0.00134277L7.00067 16L14 9.00067Z" fill="currentColor"/>
       3 │ </svg>
         ╰────

  help:
        You may need an appropriate loader to handle this file type.


ERROR in ./apps/insight/src/utils/bye.svg
  × Module parse failed:
  ╰─▶   × JavaScript parsing error: Expression expected
         ╭─[1:1]
       1 │ <svg width="14" height="16" viewBox="0 0 14 16" fill="none" xmlns="http://www.w3.org/2000/svg">
         · ─
       2 │ <path d="M14 9.00067H10.0004V1.08016e-05H4.00096V9.00067H0.00134277L7.00067 16L14 9.00067Z" fill="currentColor"/>
       3 │ </svg>
         ╰────

  help:
        You may need an appropriate loader to handle this file type.


Rspack 0.5.9 compiled with 2 errors in 2.42 s

Package Manager Version

No response

Operating System

• macOS
• Linux
• Windows
• Other (Please specify)

Additional Information

No response

[BogdanMihalca]

might be related (same) to this one: #22362

[ndcunningham]

Should be addressed with: #22628

Check out the latest canary until a new version has been released!

[github-actions]

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.