Skip to content

digitalmoran/fontmin

This branch is 24 commits behind ecomfe/fontmin:master.

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Jul 19, 2019
72da8d4 · Jul 19, 2019
Apr 6, 2016
Jul 18, 2019
Jul 18, 2019
Jul 18, 2019
Jan 30, 2015
May 5, 2016
May 5, 2016
Jul 18, 2019
Jul 18, 2019
Jan 30, 2015
May 11, 2016
May 6, 2015
Jan 5, 2016
Feb 13, 2015
May 10, 2018
Jul 19, 2019

Repository files navigation

fontmin

Minify font seamlessly

NPM version Build Status Downloads Dependencies Font support

Homepage

Install

$ npm install --save fontmin

Usage

var Fontmin = require('fontmin');

var fontmin = new Fontmin()
    .src('fonts/*.ttf')
    .dest('build/fonts');

fontmin.run(function (err, files) {
    if (err) {
        throw err;
    }

    console.log(files[0]);
    // => { contents: <Buffer 00 01 00 ...> }
});

You can use gulp-rename to rename your files:

var Fontmin = require('fontmin');
var rename = require('gulp-rename');

var fontmin = new Fontmin()
    .src('fonts/big.ttf')
    .use(rename('small.ttf'));

API

new Fontmin()

Creates a new Fontmin instance.

.src(file)

Type: Array|Buffer|String

Set the files to be optimized. Takes a buffer, glob string or an array of glob strings as argument.

.dest(folder)

Type: String

Set the destination folder to where your files will be written. If you don't set any destination no files will be written.

.use(plugin)

Type: Function

Add a plugin to the middleware stack.

.run(cb)

Type: Function

Optimize your files with the given settings.

cb(err, files, stream)

The callback will return an array of vinyl files in files and a Readable/Writable stream in stream

Plugins

The following plugins are bundled with fontmin:

  • glyph — Compress ttf by glyph.
  • ttf2eot — Convert ttf to eot.
  • ttf2woff — Convert ttf to woff.
  • ttf2svg — Convert ttf to svg.
  • css — Generate css from ttf, often used to make iconfont.
  • svg2ttf — Convert font format svg to ttf.
  • svgs2ttf — Concat svg files to a ttf, just like css sprite.
  • otf2ttf — Convert otf to ttf.

.glyph()

Compress ttf by glyph.

var Fontmin = require('fontmin');

var fontmin = new Fontmin()
    .use(Fontmin.glyph({ 
        text: '天地玄黄 宇宙洪荒',
        hinting: false         // keep ttf hint info (fpgm, prep, cvt). default = true
    }));

.ttf2eot()

Convert ttf to eot.

var Fontmin = require('fontmin');

var fontmin = new Fontmin()
    .use(Fontmin.ttf2eot());

.ttf2woff()

Convert ttf to woff.

var Fontmin = require('fontmin');

var fontmin = new Fontmin()
    .use(Fontmin.ttf2woff({
        deflate: true           // deflate woff. default = false
    }));

.ttf2svg()

Convert ttf to svg.

you can use imagemin-svgo to compress svg:

var Fontmin = require('fontmin');
var svgo = require('imagemin-svgo');

var fontmin = new Fontmin()
    .use(Fontmin.ttf2svg())
    .use(svgo());

.css()

Generate css from ttf, often used to make iconfont.

var Fontmin = require('fontmin');

var fontmin = new Fontmin()
    .use(Fontmin.css({
        fontPath: './',         // location of font file 
        base64: true,           // inject base64 data:application/x-font-ttf; (gzip font with css). 
                                // default = false
        glyph: true,            // generate class for each glyph. default = false
        iconPrefix: 'my-icon',  // class prefix, only work when glyph is `true`. default to "icon"
        fontFamily: 'myfont',   // custom fontFamily, default to filename or get from analysed ttf file
        asFileName: false,      // rewrite fontFamily as filename force. default = false
        local: true             // boolean to add local font. default = false
    }));

Alternatively, a transform function can be passed as fontFamily option.

var Fontmin = require('fontmin');

var fontmin = new Fontmin()
    .use(Fontmin.css({
        // ...
        fontFamily: function(fontInfo, ttf) {
          return "Transformed Font Family Name"
        },
        // ...
    }));

.svg2ttf()

Convert font format svg to ttf.

var Fontmin = require('fontmin');

var fontmin = new Fontmin()
    .src('font.svg')
    .use(Fontmin.svg2ttf());

.svgs2ttf()

Concat svg files to a ttf, just like css sprite.

awesome work with css plugin:

var Fontmin = require('fontmin');

var fontmin = new Fontmin()
    .src('svgs/*.svg')
    .use(Fontmin.svgs2ttf('font.ttf', {fontName: 'iconfont'}))
    .use(Fontmin.css({
        glyph: true
    }));

.otf2ttf()

Convert otf to ttf.

var Fontmin = require('fontmin');

var fontmin = new Fontmin()
    .src('fonts/*.otf')
    .use(Fontmin.otf2ttf());

CLI

$ npm install -g fontmin
$ fontmin --help

  Usage
    $ fontmin <file> [<output>]
    $ fontmin <directory> [<output>]
    $ fontmin <file> > <output>
    $ cat <file> | fontmin > <output>

  Example
    $ fontmin fonts/* build
    $ fontmin fonts build
    $ fontmin foo.ttf > foo-optimized.ttf
    $ cat foo.ttf | fontmin > foo-optimized.ttf

  Options
    -t, --text                          require glyphs by text
    -b, --basic-text                    require glyphs with base chars
    -d, --deflate-woff                  deflate woff
    --font-family                       font-family for @font-face CSS
    --css-glyph                         generate class for each glyf. default = false
    -T, --show-time                     show time fontmin cost

you can use curl to generate font for websites running on PHP, ASP, Rails and more:

$ text=`curl www.baidu.com` && fontmin -t "$text" font.ttf

or you can use html-to-text to make it smaller:

$ npm install -g html-to-text
$ text=`curl www.baidu.com | html-to-text` && fontmin -t "$text" font.ttf

what is more, you can use phantom-fetch-cli to generate font for SPA running JS template:

$ npm install -g phantom-fetch-cli
$ text=`phantom-fetch http://www.chinaw3c.org` && fontmin -t "$text" font.ttf

Related

Thanks

License

MIT © fontmin

About

Minify font seamlessly

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 96.2%
  • Smarty 2.2%
  • HTML 1.6%