laravel-elixir-svg-symbols

1.0.1 • Public • Published

Laravel Elixir SVG Symbols

Extension to Laravel Elixir that uses gulp-svg-sprite to generate a sprite file out of individual SVG files. Consider it the image spriting technique but for SVGs. It's highly recommended to read these awesome articles to learn all about this technique:

Install

npm install laravel-elixir-svg-symbols --save

Use

var elixir = require('laravel-elixir');
 
require('laravel-elixir-svg-symbols');
 
elixir(function(mix) {
    mix.svgSprite();
});

Yes, it's that simple. This will use the extension's default options, which are to find .svg files inside an svg directory in your assets directory (either Laravel's default or your own defined in elixir.json). It will output a sprite file named as sprite.svg to public/svg which can then be included in your project's markup.

    <svg class="icon">
        <use xlink:href="/svg/sprite.svg#icon-example"></use>
    </svg>

Configure

You can override the extension's settings by passing the following optional parameters like:

    mix.svgSprite(src, output, pluginOptions)

src

Path to the directory that holds the individual SVGs. Set as null if default is fine.

output

Path to the directory that will hold the generated spritesheet file. Set as null if default is fine.

pluginOptions

Options passed along directly to gulp-svg-sprite. Read the README for more info on these.

Example

This example sets custom source and output directories, and changes the generated file name to symbols.svg.

var elixir = require('laravel-elixir');
 
require('laravel-elixir-svg-symbols');
 
elixir(function(mix) {
    mix.svgSymbols('my/assets/directory/', 'my/output/directory/', {
        mode: {
            symbol: {
                dest: '.',
                sprite: 'symbols.svg'
            }
        }
    });
});

For more complex examples and all the svg-sprite documentation, check out its repo.

All credit goes to

Readme

Keywords

Package Sidebar

Install

npm i laravel-elixir-svg-symbols

Weekly Downloads

7

Version

1.0.1

License

ISC

Last publish

Collaborators

  • waldemarfm