Import svg files to Fontello icon font project, use svg filename as glyph name. Also provide task for auto download exported css and font files into destinated folder.
npm install --save-dev gulp-fontello
├── LICENSE.txt ├── README.txt ├── config.json ├── css │ ├── animation.css │ ├── fontello-codes.css │ ├── fontello-embedded.css │ ├── fontello-ie7-codes.css │ ├── fontello-ie7.css │ └── fontello.css ├── demo.html └── font ├── fontello.eot ├── fontello.svg ├── fontello.ttf └── fontello.woff
- You should get a
config.json
file from http://fontello.com project and save it somewhere in your project; - create Gulp Task:
var
gulp = require('gulp'),
$ = require('gulp-load-plugins')()
;
gulp.task('glyph', function () {
return gulp.src('config.json')
.pipe($.fontello())
.pipe($.print())
.pipe(gulp.dest('dist'))
});
var options = {
host : 'http://fontello.com', // Host for response
font : 'font', // Destination dir for Fonts and Glyphs
css : 'css', // Destination dir for CSS Styles,
assetsOnly : true // extract from ZipFile only CSS Styles and Fonts exclude config.json, LICENSE.txt, README.txt and demo.html
}
Script can accept input parameters in CLI mode and extends options parameters in gulp task, for example:
- Gulp global install
gulp <fontello-task> --no-assets-only
- Gulp local install (For this make
gulp
scripts in package.json)
npm run gulp <fontello-task> -- --no-assets-only
--host=host
Host for response--css=css
Destination dir for Fonts and Glyphs--font=font
Destination dir for CSS Styles--no-assets-only
Extract from ZipFile CSS Styles and Fontswith
config.json, LICENSE.txt, README.txt and demo.html--assets-only
Extract from ZipFile only CSS Styles and Fontsexclude
config.json, LICENSE.txt, README.txt and demo.html