Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including metalsmith-inline-svg with all npm packages installed. Try it out:

var metalsmithInlineSvg = require("metalsmith-inline-svg")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

metalsmith-inline-svg v0.1.4

metalsmith plugin that inlines svg images into html files

metalsmith-inline-svg

A metalsmith plugin that inlines svg images into your html to reduce the number of http requests.

Remember to be selective over which svgs you inline. If you inline svgs which appear on multiple pages you wont benefit from caching which you get with individually loaded files!

This plugin doesn't remove the svg files after as it does no checking to see if they're used elsewhere.

Installation

npm install metalsmith-inline-svg

Example

var inlineSVG = require('metalsmith-inline-svg');

Metalsmith(__dirname)
  .use(inlineSVG())
  .build()

Options

You can pass options to metalsmith-inline-svg with the Javascript API or CLI. The options are:

  • selector: A jQuery/cheerio selector string used to find the images to be replaced (default 'img.svg')
  • removeDefs: A boolean which tells the plugin whether to remove <defs /> tags. I had some issues where the DOMParser was not correctly closing empty defs tags so we strip them out. (default true)

Metadata

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free