在项目中,经常遇到设计给到的ui稿中包含特殊字体,但是要引用对应的字体包又特别大,对页面性能造成困扰
我们只需要提取项目中需要用的文字、数字、符号等特殊字体,尽可能减少包体积
var Fontmin = require('fontmin'); //引入插件
var srcPath = './HYCuYuanJ.ttf'; // 字体源文件路径,需要保证该ttf文件存在
var destPath = 'font'; // 字体输出路径
var picktext = '123456,.。测试一下'; //这里进行配置需要用到的字符,可以是中文或英文字母
// 初始化
var fontmin = new Fontmin()
.src(srcPath) // 输入配置
.use(Fontmin.glyph({ // 字型提取插件
text: picktext // 所需文字
}))
.use(Fontmin.ttf2eot()) // eot 转换插件
.use(Fontmin.ttf2woff2()) // woff 转换插件
.use(Fontmin.ttf2woff()) // woff 转换插件
.use(Fontmin.ttf2svg()) // svg 转换插件
.use(Fontmin.css()) // css 生成插件
.dest(destPath); // 输出配置
// 执行
fontmin.run(function (err, files, stream) {
if (err) { // 异常捕捉
console.error(err);
}
console.log('done'); // 成功
});