esbuild-plugin-svgr
esbuild-plugin-svgr copied to clipboard
fix: Added svgo as default plugin as long svgo is not false
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.