SVG 矢量转 React JSX 组件
SVG 转 React JSX 格式
- 所有处理均在您的浏览器中完成 — 文件绝不离开您的设备。
- 完全免费,无需注册、账号或使用限制。
- 可在任何现代浏览器中使用,包括移动设备。
About this tool
SVG 转 JSX 清理器可去除臃肿的 XML 元数据,并将原始 SVG 代码转换为生产可用的 React JSX 或 Vue 3 组件,支持属性转发。
How to use
- 粘贴您的原始 <svg> 标记或图标代码。
- 配置组件名称、目标框架(React/Vue)和 TypeScript 类型。
- 将清理后、组件包装的代码直接复制到您的代码库中。
FAQ
它会修复 stroke-width 等属性命名吗?
是的,所有 短横线-case XML 属性都会自动转换为 前端框架 驼峰命名(描边宽度、填充规则、类名)。
支持 TS 吗?
支持,包含 SVG属性<SVGSVG元素> 类型定义。