search

unplugin / unplugin-icons

šŸ¤¹ Access thousands of icons as components on-demand universally.
https://www.npmjs.com/package/unplugin-icons
MIT License
3.66k stars 131 forks source link

Incompatible with svgr v7 #275

Closed tony19 closed 1 year ago

tony19 commented 1 year ago

Describe the bug

@svgr/core v7.0.0 (released 2 days ago) has removed @svgr/plugin-jsx from its default plugins, which breaks the build of unplugin-icons in React projects.

Example error:

3: import IconAlertCircle from '~icons/tabler/alert-circle'
          ^
4: import IconMessages from '~icons/tabler/messages'
5: import IconDatabase from '~icons/tabler/database'
error during build:
RollupError: "default" is not exported by "~icons/tabler/alert-circle.jsx"

This can be fixed in src/core/compilers/jsx.ts by installing @svgr/plugin-jsx and specifying that in svgr()'s plugins option:

 let res = await svgr( 
   svg, 
-  {}, 
+  {
+    plugins: ['@svgr/plugin-jsx'],
+  },
   { componentName: camelize(`${collection}-${icon}`) }, 
 )

A workaround for users is to install @svgr/core@6.

Reproduction

https://stackblitz.com/edit/unplugin-icons-bug-with-svgr

System Info

System:
    OS: macOS 13.2.1
    CPU: (10) arm64 Apple M1 Max
    Memory: 1.39 GB / 64.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 18.14.0 - ~/n/bin/node
    Yarn: 1.22.19 - ~/n/bin/yarn
    npm: 9.3.1 - ~/n/bin/npm
  Browsers:
    Chrome: 111.0.5563.110
    Edge: 111.0.1661.54
    Safari: 16.3

Used Package Manager

npm

Validations