@eyes22798/svg-icon
TypeScript icon, indicating that this package has built-in type declarations

1.0.14 • Public • Published

svg-icon

A lightweight component with no dependecy to allow use of custom SVG icons in your Vue.js application based on SVG sprite.

Installation

Using NPM:

npm install @eyes22798/svg-icon --save

Using Yarn:

yarn add @eyes22798/svg-icon

Requirements

  • Vue.js (2.x+)
  • svgxuse polyfill to support IE9-11 version
  • SVG sprite file that should be available in "/assets/icons" folder (can be changed, changed in vue.config.js)

Usage

In your main.js file:

import SvgIcon from '@eyes22798/svg-icon'

Vue.use(SvgIcon)

In your vue.config.js

You can customize the component name and icon assets dir

const SvgIconConfig = require('@eyes22798/svg-icon/webpack')

module.exports = {
  chainWebpack: (config) => {
    SvgIconConfig({ config, iconPath: './src/assets/icons', name: 'svg-icon' })
  }
}

In your components:

this name is current svg file name

  <svg-icon name="file_name" className="iconClass"></svg-icon>
  • name - SVG sprite symbol id value (svg file name)
  • className - svg class,arrays are supported(:className=['class1', 'class2']

Customize configuration

See Configuration Reference.

Package Sidebar

Install

npm i @eyes22798/svg-icon

Weekly Downloads

2

Version

1.0.14

License

MIT

Unpacked Size

39.1 kB

Total Files

7

Last publish

Collaborators

  • eyes22798