⾮常⽅便的将SVG图标⽣成TTFEOTWOFFWOFF2SVG字体⼀般情况我通过 或者 来实现图标管理⽣成字体，导⼊到项⽬中使⽤。
┌────────┐┌────────────┐
│iconfont    │──┐│  Project          │
└────────┘│┌────────────┐┌────────┐│┌────────┐│
fontweight默认值├─▶│created font      │─▶│download    │──▶││use font    ││
┌────────┐│└────────────┘└────────┘│└────────┘│
│icomoon      │──┘└────────────┘
└────────┘
使⽤说明
1. 图标字体只能被渲染成单⾊，不能⽣成 彩⾊图标。
2. 图标将放到平台中维护，下载字体⽂件到项⽬中使⽤，这样团队维护⽣成字体成本将⾮常⾼。
通过图标平台⽹站下载 svg 图标，将图标放到项⽬中管理，通过 ⼯具来⽣成它，这将是新的字体图标使⽤⽅式：
┌────────────────┐
│      Project              │
││
┌────────┐│┌────────┐│
│iconfont    │──┐││    svg      │───┐│
└────────┘│┌────────┐│└────────┘││
├─▶│download svg │─▶│┌─────────┐││
┌────────┐│└────────┘│┌─│create font    │◀─┘│
│icomoon      │──┘││└─────────┘│
└────────┘││┌───────────┐│
│└─▶│ use font        ││
│└───────────┘│
└────────────────┘
新的⽅式维护⽅式好处：
1. 不需要知道第三⽅平台账号维护，将图标下载到项⽬中维护图标，不再维护字体⽂件
2. ⽣成彩⾊图标⽂件 SVG Symbol 在项⽬中使⽤
svgtofont
读取⼀组 SVG图标并从SVG图标输出 TTF/EOT/WOFF/WOFF2/SVG 字体，字体⽣成器。
特性
1. ⽀持的字体格式：WOFF2，WOFF，EOT，TTF和SVG。
2. ⽀持 SVG Symbol ⽂件。
3. ⾃动⽣成模板（例如css，less等），可以直接使⽤。
4. ⾃动⽣成预览⽹站，预览字体⽂件。
实例
安装
npm i svgtofont
使⽤
简单的使⽤⽅式
const svgtofont =require("svgtofont");
svgtofont({
src: solve(process.cwd(),"icon"),// svg 图标⽬录路径  dist: solve(process.cwd(),"fonts"),// 输出到指定⽬录中  fontName:"svgtofont",// 设置字体名称
css:true,// ⽣成字体⽂件
}).then(()=>{
console.log('done!');
});
⾼级⽤法
const svgtofont =require("svgtofont");
const path =require("path");
svgtofont({
src: solve(process.cwd(),"icon"),// svg 图标⽬录路径
dist: solve(process.cwd(),"fonts"),// 输出到指定⽬录中
fontName:"svgtofont",// 设置字体名称
css:true,// ⽣成字体⽂件
startNumber:20000,// unicode起始编号
svgicons2svgfont:{
fontHeight:1000,
normalize:true
},
// website = null, 没有演⽰html⽂件
website:{
title:"svgtofont",
// Must be a .svg format image.
logo: solve(process.cwd(),"svg","git.svg"),
version: pkg.version,
meta:{
description:"Converts SVG fonts to TTF/EOT/WOFF/WOFF2/SVG format.",
keywords:"svgtofont,TTF,EOT,WOFF,WOFF2,SVG"
},
description:``,
links:[
{
title:"GitHub",
url:"github/jaywcjlove/svgtofont"
},
{
title:"Feedback",
url:"github/jaywcjlove/svgtofont/issues"
},
{
title:"Font Class",
url:"index.html"
},
{
title:"Unicode",
url:"unicode.html"
}
],
footerInfo:`Licensed under MIT. (Yes it's free and <a href="github/jaywcjlove/svgtofont">open-sourced</a>` }
}).then(()=>{
console.log('done!');
});;
API
提供 API，可以⼀个⼀个的⾃⼰⽣成，也可以⾃动通过上⾯⽅法⾃动⽣成
const{
createSVG,
createTTF,
createEOT,
createWOFF,
createWOFF2
}=require("svgtofont/src/utils");
const options ={...};
createSVG(options)// SVG => SVG Font
.then(UnicodeObjChar =>createTTF(options))// SVG Font => TTF .then(()=>createEOT(options))// TTF => EOT
.then(()=>createWOFF(options))// TTF => WOFF
.then(()=>createWOFF2(options))// TTF => WOFF2
.then(()=>createSvgSymbol(options))// SVG Files => SVG Symbol options
svgtofont(options)
dist
Type: String
Default value: dist
svg 图标路径
src
Type: String
Default value: svg
输出到指定⽬录
fontName
Type: String
Default value: iconfont
您想要的字体名称。
unicodeStart
Type: Number
Default value: 10000
unicode起始编号
clssaNamePrefix
Type: String
Default value: font name
创建字体类名称前缀，默认值字体名称。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。