gem-hunter
Language: JavaScript
A rollup plugin JUST to transform SVG files to symobl strings, then you can freely handle them.
A rollup plugin JUST to transform SVG files to symobl strings, then you can freely handle them.
Webpack version: fjc0k/svg-to-symbol-loader
# Yarn yarn add rollup-plugin-svg-to-symbol -D # npm npm i rollup-plugin-svg-to-symbol -D
// rollup.config.js const svgToSymbol = require('rollup-plugin-svg-to-symbol') module.exports = { plugins: [ svgToSymbol() ] }
// sprite.js import add from './svg/add.svg' import close from './svg/close.svg' export default [ '<svg><defs>', add, close, '</defs></svg>' ].join('')
The default export just likes:
<svg> <defs> <symbol id="add">.....</symbol> <symbol id="close">.....</symbol> </defs> </svg>
({ name }) => id({ filePath, name }) => namename is the SVG filename without the extension. e.g.// rollup.config.js svgToSymbol({ extractId({ name }) { return `icon-${name}` } })
import add from './svg/add.svg' // the add likes: // <symbol id="icon-add">...</symbol>