Laravel Elixir Icon fonts

This is a simple gulp-iconfont and gulp-iconfont-css wrapper for Laravel Elixir.

Install

Install this package over npm.

npm install laravel-elixir-fonts --save-dev

Require it in your gulpfile.js and use it.

var elixir = require('laravel-elixir');
 
require('laravel-elixir-fonts');
 
elixir(function(mix) {
 
  mix.fonts([elixir.config.assetsPath + '/svg/**/*.svg'], elixir.config.publicPath + '/fonts/', { font: { fontName: 'my_icons' } });
 
});

How To

If you run mix.fonts() without parameters, it looks for all SVG-Files in resources/assets/svg (folders included).

The output of the icons.css file is in resources/assets/css. The output of your fonts is in public/assets/fonts.

These are the default paths, they can be overwritten by elixir.config.assetsPath and elixir.config.css.outputFolder or by pass options. See the config file from elixir for more options.

Options

Default options

{
    font: {
        normalize: true,
        fontName: fontName, // required
        prependUnicode: false, // recommended option
        formats: ['ttf', 'eot', 'woff', 'woff2', 'svg'], // default, 'woff2' and 'svg' are available
        timestamp: runTimestamp // recommended to get consistent builds when watching files
    },
    css: {
        fontName: fontName,
        targetPath: '../../' + elixirConfig.assetsPath + '/' + elixirConfig.css.sass.folder + '/' + fontName + '.scss',
        fontPath: '../fonts/'
    }
}