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

How to really generate viewBox from svg sizes?

Open winkyBrain opened this issue 1 year ago • 1 comments

"removeDimensions: true" from here https://react-svgr.com/docs/options/#dimensions does nothing.

I tried this config: svgr({ include: '**/*.svg?react', svgrOptions: { svgo: true, svgoConfig: { removeDimensions: true, }, svgProps: { height: '12', width: '12', }, }, }), add this svgr({ include: '**/*.svg?react', svgrOptions: { svgo: true, svgoConfig: { plugins: ['removeDimensions'], }, svgProps: { height: '12', width: '12', }, }, }),

with any svg, but the viewbox attribute did not appear in any svg

"vite-plugin-svgr": "4.2.0", "svgo": "3.2.2",

winkyBrain avatar Sep 11 '24 13:09 winkyBrain

Hey, @winkyBrain.

If you have an issue with the SVG and viewBox attribute missing, you can try this solution:

Install @svgr/plugin-svgo and change your vite-config in case you are using vite.

svgr({ svgrOptions: { plugins: ['@svgr/plugin-svgo', '@svgr/plugin-jsx'], svgoConfig: { plugins: [ { name: 'prefixIds', params: { prefixIds: true }, }, ], }, }, }),

It worked well for me.

mariyan250 avatar Dec 05 '24 09:12 mariyan250