跳到正文
SvgJsx
语言: 中文

关于 SvgJsx

SvgJsx 是一个小而专注的开发者工具:它能快速、私密地把 SVG 代码转换为框架组件,而且无需注册。

我们为什么做这个工具

每个前端项目迟早都需要自定义图标。设计师导出 SVG 文件后,开发者要花时间重命名属性、删除编辑器元数据,再把标记包装成组件。现有的在线转换器往往会把文件上传到服务器、在步骤之间插播广告,或者只支持 React。

SvgJsx 完全在浏览器中运行,支持团队真正在用的框架,输出的代码遵循现代规范,无需手动清理即可提交。

工作原理

转换器内置了一个用 TypeScript 编写的小型 XML 解析器。它会把 SVG 解析成树,执行你选择的清理步骤,例如移除元数据、数字取整或把颜色替换为 currentColor,再把这棵树输出为 JSX、Vue 模板或 react-native-svg 组件。这些代码针对每个选项以及格式错误的输入都有自动化测试覆盖。

网站是静态生成的,通过 CDN 分发。没有后端,没有数据库,也没有账号系统。

我们的原则

这个项目遵循几条简单的原则:

  • 隐私优先:你的 SVG 永远不会离开你的设备。
  • 输出可读:格式整齐的代码,只包含必要的导入。
  • 默认安全:脚本和内联事件处理器会被移除。
  • 支持七种语言:英语、中文、西班牙语、德语、法语、日语和葡萄牙语。

常见问题

SvgJsx 由谁维护?

SvgJsx 是一个独立项目,与 ContrastCheck 和宽高比计算器出自同一团队,这是一系列面向设计师和开发者的免费浏览器端小工具。

SvgJsx 接受功能建议吗?

欢迎提出新的输出格式或选项建议。目前的重点是为 React、React Native、Vue 和 Solid 提供可靠的输出。

SvgJsx 靠什么盈利?

目前不盈利。网站是静态的,托管成本极低,也没有任何付费套餐。

生成的代码可以商用吗?

可以。转换器生成的代码归你所有,可用于任何项目。请注意确认你所转换的原始 SVG 作品的许可协议。