Inserting SVG icons was never so easy.
npm install gulp-svg-icons
In your HTML sources just add icons like:
and it will be replaced by:
where "trophy" is the name of the icon's file (path/to/the/icons/trophy.svg); and use the placeholder where you want the symbol definitions (in the index.html for example, in case that you are building a SPA):
<!-- icons -->
and then invoke it through gulp:
var gulp = ;var Icons = ;var icons = 'src/icons';gulp;gulp;
An string to use on every icon id (concatenated using "-") or a falsy value (false, null...) to avoid prefixes.
An string to be replaced with the icons definitions. The default is
<!-- icons -->.
A function which will receive every icon name and should return the desired CSS class name. The default will return just
A boolean to indicate if you want to inject only the icons found in the replace process or all the SVG files in the icon's dir. Default is
A function which will receive every icon name and should return the desired path to the icons defs, useful to keep those in an external file (and share them between documents, see this). The default will return just an empty string, meaning that the icons are supposed to be defined in the same document.