SVG 矢量转 React JSX 组件

SVG 转 React JSX 格式

About this tool

SVG 转 JSX 清理器可去除臃肿的 XML 元数据,并将原始 SVG 代码转换为生产可用的 React JSX 或 Vue 3 组件,支持属性转发。

How to use

  1. 粘贴您的原始 <svg> 标记或图标代码。
  2. 配置组件名称、目标框架(React/Vue)和 TypeScript 类型。
  3. 将清理后、组件包装的代码直接复制到您的代码库中。

FAQ

它会修复 stroke-width 等属性命名吗?

是的,所有 短横线-case XML 属性都会自动转换为 前端框架 驼峰命名(描边宽度、填充规则、类名)。

支持 TS 吗?

支持,包含 SVG属性<SVGSVG元素> 类型定义。

Tags

Related tools