Skip to content

sionzee/rollup-plugin-inline-svg

master
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

rollup-plugin-inline-svg

A rollup plugin for inlining svg files

Build Status Coverage Status

Features

  • Checking validity of SVG files
  • Filtering out attributes and tags with unwrap or delete action
  • Traversing AST of SVG files
  • Zero configuration config

Installation

pnpm install --save-dev rollup-plugin-inline-svg
npm install --save-dev rollup-plugin-inline-svg
yarn add --dev rollup-plugin-inline-svg

Configuration

In your rollup.config.js file

import InlineSvg from 'rollup-plugin-inline-svg';

export default {
  // Omitted Fields
  plugins: [InlineSvg()],
}

or more advanced configuration

import InlineSvg, {markAsRemoved} from 'rollup-plugin-inline-svg';

export default {
  // Omitted Fields
  plugins: [
    InlineSvg({
      forbidden: {
        tags: ['div', 'style:remove'],
        attrs: ['width', 'height'],
      },
      include: ['src/**/*.svg'],
      traverse: (node: AstNode) => {
        if(node?.name === 'div' && node?.attrs?.['id'] !== undefined) {
          // remove all divs with id attributes
          markAsRemoved(node) // or markAsUnwrapped
        }
      },
    })
  ],
}

Note: You can read about the options in CHANGELOG.md

Usage

import UserIcon from "@icons/user.svg"

document.querySelectorAll(`.icon.user`).forEach((node) => {
  node.innerHTML = UserIcon;
})

Note: If you are not using custom module resolution, you should append .svg to import path.

License

MIT, see LICENSE for more information.

About

Adds support for importing svg files with inline mode.

Resources

License

Stars

Watchers

Forks

Packages

No packages published