
What's Included
This package includes everything you need for SVG to component conversion:
- CLI Tool - Convert SVG files from command line
- Node.js API - Programmatic conversion in Node.js
- Module API - Browser-compatible module for web apps
- React & Vue Support - Generate components for both frameworks
- TypeScript Ready - Full TypeScript support with proper types
Installation
npm install svgfusion
Quick Start
CLI Usage
# Clone the repository
git clone https://github.com/lolvOid/svgfusion
cd svgfusion
pnpm install
# Build first (required)
pnpm build
# Use the CLI
pnpm svgfusion icon.svg --framework react --output ./components
pnpm svgfusion ./icons --framework vue --typescript --output ./components
Module Usage (Browser/Web Apps)
import { convertToReact, convertToVue } from 'svgfusion/browser';
const svgCode = `<svg viewBox="0 0 24 24"><path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/></svg>`;
// React component
const reactResult = await convertToReact(svgCode, {
componentName: 'StarIcon',
typescript: true,
splitColors: true,
});
// Vue component
const vueResult = await convertToVue(svgCode, {
componentName: 'StarIcon',
typescript: true,
splitColors: true,
});
Node.js API
import { SVGFusion } from 'svgfusion';
const engine = new SVGFusion();
const result = await engine.convert(svgContent, {
framework: 'react',
transformation: { splitColors: true },
generator: { typescript: true, componentName: 'MyIcon' },
});
Documentation
For complete guides, API reference, and examples visit svgfusion.netlify.app
License
MIT