esbuild-plugin-svgr icon indicating copy to clipboard operation
esbuild-plugin-svgr copied to clipboard

fix: Added svgo as default plugin as long svgo is not false

Open mrxder opened this issue 6 months ago • 0 comments

First of all, thank you for creating this plugin. I came to esbuild-plugin-svgr from @svgr/rollup and was happy that there allready exists an equivalent to the rollup version.

Unfortunately, I had the issue that esbuild-plugin-svgr does not behave like the official @svgr/rollup. A lot of my SVGs looked wrong. This happened because the CSS classes of the SVGs clashed, and the styles got overwritten. I figured out that esbuild-plugin-svgr does not invoke the @svgr/plugin-svgo by default as the rollup plugin does. The svgo plugin would make the classes and IDs unique so that clashes can not happen.

Adding @svgr/plugin-svgo to the options in the esbuild config file is possible. But I think it would save a lot of work for people if the esbuild-plugin-svgr would behave the same as the official @svgr/rollup.

Here, you see that svgo should be true by default: https://react-svgr.com/docs/options/#svgo

Here you see that the official @svgr/rollup plugin also has svgo set as default plugin: https://github.com/gregberge/svgr/blob/main/packages/rollup/src/index.ts#L63

The svgo plugin needs to be before the jsx plugin. Therefore, I added it the way as you can see in the code.

mrxder avatar Aug 06 '24 09:08 mrxder