Package Exports

svg64

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (svg64) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

SVG64

Convert SVG to base64 anywhere

About

If you, like me, are using lots of SVGs when developing, you might have come to a point where you need your SVG used as background image or embedded in your javascript file. The only way to do this is to convert your SVG file to a base64 string and then use it where needed. This package does exactly this - it converts SVGs to base64.

This package works in a browser and in a Node environment. Please read along to understand how.

Install

npm i svg64

yarn add svg64

just download this repository and use the files located in dist folder.

Usage

In a browser:

// This is your SVG DOM element
const svg = document.getElementById('svg');

// This is your DOM element that needs SVG background image
const demo = document.getElementById('demo');

// This is your SVG in base64 representation
const base64fromSVG = SVG64(svg);

// Add the base64 image as a background to your element
demo.style.backgroundImage = `url(${base64fromSVG})`;

In Node:

// Require svg64
const SVG64 = require('svg64').default;

// Import `readFileSync` from the file system module
const { readFileSync } = require('fs');

// Read your SVG file's contents
const svg = readFileSync('./file.svg', 'utf-8');

// This is your SVG in base64 representation
const base64fromSVG = SVG64(svg);

Demo

There is a simple demo illustrating how the SVG64 library works in browser.

Check it out here

There is a simple demo illustrating how the SVG64 library works in Node.

Check it out here

LICENSE

MIT