#svg #svelte #component #convert #animation #file #rewritten

bin+lib svg2svelte

Easily turn an SVG file into a Svelte component, Rewritten in Rust

6 releases

0.2.3 Aug 25, 2022
0.2.2 Aug 25, 2022
0.1.1 Aug 24, 2022

#13 in #svelte

26 downloads per month

AGPL-3.0

58KB
160 lines

svg2svelte-rs

svg2svlete

Easily turn an SVG file into a Svelte component, Rewritten in Rust.

How it works

svg2svelte parses the svg file's ids for bind: in the name and converts them into variables we can manipulate later on with an animation library (e.g. anime.js)

Dependencies

  • svgo will need to be installed globally
npm i -g svgo           # npm
yarn global add svgo    # yarn
pnpm add -g svgo        # pnpm

Installation

build from source

git clone https://github.com/derektata/svg2svelte-rs
cd svg2svelte-rs
make

using cargo

cargo install svg2svelte

Usage

USAGE:
    svg2svelte [OPTIONS] [SVG_FILE]

ARGS:
    <SVG_FILE>    File to be processed

OPTIONS:
    -h, --help          Print help information
    -t, --typescript    Create a Typescript component
    -v, --verbose       Print the generated component to stdout
    -V, --version       Print version information

EXAMPLES:
    svg2svelte ball.svg
    svg2svelte -t ball.svg

Why?

The previous implementation I had written up in shell had issues running cross-platform and only worked on Linux, so I decided to start learning more Rust and this project was born.

Dependencies

~6.5MB
~117K SLoC