fontmin

fontmin

ย่ออักษรลงอย่างลงมืออย่างราบรื่น

หน้าแรก

• 简体中文
• 繁體中文
• 日本語
• 한국어
• ภาษาอังกฤษ

ติดตั้ง

$ npm install --save fontmin

สังเกต

Fontmin v2.x รองรับโมดูล ES เท่านั้นและทำงานบนโหนด V16+

หากคุณต้องการใช้เวอร์ชัน CommonJS โปรดติดตั้ง fontmin v1.x :

NPM Install -Save Fontmin@1

การใช้งาน

 import Fontmin from 'fontmin' ;

const 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 ...> }
} ) ;

คุณสามารถใช้ Gulp-Rename เพื่อเปลี่ยนชื่อไฟล์ของคุณ:

 import Fontmin from 'fontmin' ;
const rename = require ( 'gulp-rename' ) ;

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

API

ใหม่ fontmin ()

สร้างอินสแตนซ์ Fontmin ใหม่

.SRC (ไฟล์)

ประเภท: Array|Buffer|String

ตั้งค่าไฟล์ที่จะปรับให้เหมาะสม ใช้บัฟเฟอร์สตริงลูกโลกหรืออาร์เรย์ของสายลูกโลกเป็นข้อโต้แย้ง

.DEST (โฟลเดอร์)

ประเภท: String

ตั้งค่าโฟลเดอร์ปลายทางเป็นตำแหน่งที่จะเขียนไฟล์ของคุณ หากคุณไม่ได้ตั้งค่าปลายทางใด ๆ จะไม่มีการเขียนไฟล์

. ใช้ (ปลั๊กอิน)

ประเภท: Function

เพิ่ม plugin ลงในสแต็กมิดเดิลแวร์

.Run (CB)

ประเภท: Function

เพิ่มประสิทธิภาพไฟล์ของคุณด้วยการตั้งค่าที่กำหนด

CB (เอ่อไฟล์สตรีม)

การโทรกลับจะส่งคืนอาร์เรย์ของไฟล์ไวนิลใน files และสตรีมที่อ่านได้/เขียนได้ใน stream

ปลั๊กอิน

ปลั๊กอินต่อไปนี้มาพร้อมกับ fontmin:

• Glyph - บีบอัด TTF โดย Glyph
• TTF2EOT - แปลง TTF เป็น EOT
• TTF2WOFF - แปลง TTF เป็น WOFF
• TTF2WOFF2 - แปลง TTF เป็น WOFF2
• TTF2SVG - แปลง TTF เป็น SVG
• CSS - สร้าง CSS จาก TTF มักใช้ทำไอคอน
• SVG2TTF - แปลงรูปแบบตัวอักษร SVG เป็น TTF
• SVGS2TTF - ไฟล์ SVG concat ไปยัง TTF เช่นเดียวกับ CSS Sprite
• OTF2TTF - แปลง OTF เป็น TTF

. glyph ()

บีบอัด TTF โดย Glyph

 import Fontmin from 'fontmin' ;

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

.TTF2EOT ()

แปลง TTF เป็น EOT

 import Fontmin from 'fontmin' ;

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

.TTF2WOFF ()

แปลง TTF เป็น woff

 import Fontmin from 'fontmin' ;

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

.TTF2WOFF2 ()

แปลง TTF เป็น WOFF2

 import Fontmin from 'fontmin' ;

const fontmin = new Fontmin ( )
    . use ( Fontmin . ttf2woff2 ( ) ) ;

.TTF2SVG ()

แปลง TTF เป็น SVG

คุณสามารถใช้ Imagemin-SVGO เพื่อบีบอัด SVG:

 import Fontmin from 'fontmin' ;
const svgo = require ( 'imagemin-svgo' ) ;

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

.CSS ()

สร้าง CSS จาก TTF มักใช้ทำไอคอน

 import Fontmin from 'fontmin' ;

const 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
    } ) ) ;

อีกทางเลือกหนึ่งฟังก์ชันการแปลงสามารถส่งผ่านเป็นตัวเลือก fontFamily

 import Fontmin from 'fontmin' ;

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

.SVG2TTF ()

แปลงรูปแบบตัวอักษร SVG เป็น TTF

 import Fontmin from 'fontmin' ;

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

.SVGS2TTF ()

เชื่อมต่อไฟล์ SVG ไปยัง TTF เช่นเดียวกับ CSS Sprite

งานที่ยอดเยี่ยมกับปลั๊กอิน CSS:

 import Fontmin from 'fontmin' ;

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

.OTF2TTF ()

แปลง OTF เป็น TTF

 import Fontmin from 'fontmin' ;

const 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

คุณสามารถใช้ curl เพื่อสร้างแบบอักษรสำหรับเว็บไซต์ที่ทำงานบน PHP, ASP, Rails และอื่น ๆ :

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

หรือคุณสามารถใช้ HTML-to-text เพื่อให้เล็กลง:

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

ยิ่งไปกว่านั้นคุณสามารถใช้ Phantom-Fetch-CLI เพื่อสร้างแบบอักษรสำหรับเทมเพลต JS ที่ใช้งาน SPA :

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

ที่เกี่ยวข้อง

• Fontmin-App
• อึกทึก
• fonteditor

ขอบคุณ

• จินตนาการ
• ฟรีแบบอักษรจีน
• 浙江民间书刻体

ใบอนุญาต

mit © fontmin