View Code? Open in Web Editor NEW

Keep only used glyphs and remove unused glyphs. Generate font subsets to achieve the purpose of compression

License: MIT License

JavaScript 7.47% TypeScript 92.53%

font-minify's Introduction

font-minify

Keep only used glyphs and remove unused glyphs. Generate font subsets to achieve the purpose of compression

Install

Using npm:

npm install font-minify --save-dev

Usage

import fs from 'node:fs'
import { fileURLToPath } from 'node:url'
import { dirname, join, parse } from 'node:path'
import minify from 'font-minify'
// or use CommonJS
// const minify = require('font-minify')

const __filename = fileURLToPath(import.meta.url)
const __dirname = dirname(__filename)

const TEST_STRING = `Font-Minify 你说，儿豁**人不骗**人`
const fontPath = join(__dirname, 'fonts/fontfile.ttf')
const buffer = fs.readFileSync(fontPath)

;(async () => {
  const ext = 'ttf'
  const newBuffer = await minify({
    buffer,
    text: TEST_STRING,
    readOptions: {
      type: ext,
    },
    writeOptions: {
      type: ext,
    },
  })

  const fontPath = join(__dirname, 'fonts/fontfile.new.ttf')
  fs.writeFileSync(fontPath, newBuffer)
})()

If you're going to run it in a browser and you're going to work with woff2 fonts, then you should also need dist/woff2.wasm, and when you do, you must also pass in the path to the woff2.wasm file. Otherwise you can't handle the woff2 font.

// example
import minify from 'font-minify'

const newBuffer = await minify({
  buffer,
  text: TEST_STRING,
  wasm: {
    // The path where you store `woff2.wasm`.
    woff2: 'woff2.wasm' // If you're using a packaging tool to build your front-end project, then you should put `woff2.wasm` in the `public` directory
  },
  readOptions: {
    type: 'ttf',
  },
  writeOptions: {
    type: 'woff2',
  },
})

If you're using vite to build your front-end project (Vite Static Asset Handling)

// example
import minify from 'font-minify'
import woff2Wasm from 'font-minify/woff2Wasm?url'

const newBuffer = await minify({
  buffer,
  text: TEST_STRING,
  wasm: {
    woff2: woff2Wasm
  },
  readOptions: {
    type: 'ttf',
  },
  writeOptions: {
    type: 'woff2',
  },
})