jacobmarshall-react-inline-svg

React Component to load and inline SVG images, allowing you to target and style SVGs using CSS.

Features

• Easy to use, just add InlineSVG components
• Loads SVGs automatically using a XMLHttpRequest
• Loads each SVG exactly once, and caches them for repeated use
• Can preload SVGs in advance using InlineSVG.cache

Installation

$ npm i --save jacobmarshall-react-inline-svg

Usage

Include the component:

<script src="https://unpkg.com/[email protected]/dist/react-inline-svg.js"></script>

Or...

import InlineSVG from 'jacobmarshall-react-inline-svg';

Render an inline SVG:

<InlineSVG src="/path/to/your.svg" className="css-class" />

Pre-loading SVGs

InlineSVG.cache.load("/path/to/your.svg");

Building from Source

To re-build this after making changes in src, simply run:

$ gulp