@svelte-put/inline-svg

Svelte action use:inlineSvg for inlining dynamic SVGs (fetched from network)

svelte-put

This package is part of the @svelte-put family. For contributing guideline and more, refer to its readme.

Usage & Documentation

See the dedicated documentation page here.

Quick Start

<script>
  import { inlineSvg } from '@svelte-put/inline-svg';
</script>

<svg use:inlineSvg={'https://example.com/icon.svg'}></svg>

To inline static SVGs during build time, use @svelte-put/preprocess-inline-svg, which is also conveniently re-exported from this package.

// svelte.config.js
import { inlineSvg } from '@svelte-put/inline-svg/preprocess';

/** @type {import('@sveltejs/kit').Config} */
const config = {
  preprocess: [inlineSvg()],
};
export default config;

See documentation for preprocessor at @svelte-put/preprocess-inline-svg.

Changelog