Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Minify font seamlessly

License

NotificationsYou must be signed in to change notification settings

ecomfe/fontmin

Repository files navigation

fontmin

Minify font seamlessly

NPM versionBuild StatusDownloadsFont support

Homepage

Install

$ npm install --save fontmin

Notice

fontmin v2.x only support ES Modules, and run on Node v16+.

If you need to use CommonJS version, please installfontmin v1.x:

npm install --save fontmin@1

Usage

importFontminfrom'fontmin';constfontmin=newFontmin().src('fonts/*.ttf').dest('build/fonts');fontmin.run(function(err,files){if(err){throwerr;}console.log(files[0]);// => { contents: <Buffer 00 01 00 ...> }});

You can usegulp-rename to rename your files:

importFontminfrom'fontmin';constrename=require('gulp-rename');constfontmin=newFontmin().src('fonts/big.ttf').use(rename('small.ttf'));

API

new Fontmin()

Creates a newFontmin instance.

.src(file)

Type:Array|Buffer|String

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

.dest(folder)

Type:String

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

.use(plugin)

Type:Function

Add aplugin 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 infiles and a Readable/Writablestream instream

Plugins

The following plugins are bundled with fontmin:

  • glyph — Compress ttf by glyph.
  • ttf2eot — Convert ttf to eot.
  • ttf2woff — Convert ttf to woff.
  • ttf2woff2 — Convert ttf to woff2.
  • 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.

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

.ttf2eot()

Convert ttf to eot.

importFontminfrom'fontmin';constfontmin=newFontmin().use(Fontmin.ttf2eot());

.ttf2woff()

Convert ttf to woff.

importFontminfrom'fontmin';constfontmin=newFontmin().use(Fontmin.ttf2woff({deflate:true// deflate woff. default = false}));

.ttf2woff2()

Convert ttf to woff2.

importFontminfrom'fontmin';constfontmin=newFontmin().use(Fontmin.ttf2woff2());

.ttf2svg()

Convert ttf to svg.

you can useimagemin-svgo to compress svg:

importFontminfrom'fontmin';constsvgo=require('imagemin-svgo');constfontmin=newFontmin().use(Fontmin.ttf2svg()).use(svgo());

.css()

Generate css from ttf, often used to make iconfont.

importFontminfrom'fontmin';constfontmin=newFontmin().use(Fontmin.css({fontPath:'./',// location of font filebase64:true,// inject base64 data:application/x-font-ttf; (gzip font with css).// default = falseglyph:true,// generate class for each glyph. default = falseiconPrefix:'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 fileasFileName:false,// rewrite fontFamily as filename force. default = falselocal:true// boolean to add local font. default = false}));

Alternatively, a transform function can be passed asfontFamily option.

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

.svg2ttf()

Convert font format svg to ttf.

importFontminfrom'fontmin';constfontmin=newFontmin().src('font.svg').use(Fontmin.svg2ttf());

.svgs2ttf()

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

awesome work withcss plugin:

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

.otf2ttf()

Convert otf to ttf.

importFontminfrom'fontmin';constfontmin=newFontmin().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-familyfor @font-face CSS    --css-glyph                         generate classfor each glyf. default =false    -T, --show-time                     showtime fontmin cost

you can usecurl 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 usehtml-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 usephantom-fetch-cli to generate font forSPA 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

[8]ページ先頭
©2009-2025 Movatter.jp