ttf/woff等字体库导出svg文件上传iconfont.cn

手上有一套程序，自带iconfont字体库，想在这个字体库的基础上增加图标，不用搞两个这么麻烦。

两个字体库要考虑冲突等问题。

本想修改FontEditor代码（https://github.com/ecomfe/fonteditor）自动分割字体库导出每个字体的svg文件，

结果git代码下来没安装成功：

npm WARN enoent SKIPPING OPTIONAL DEPENDENCY: ENOENT: no such file or directory, rename 'E:\WebSite
PHP\www\iconfont\fonteditor-master\node_modules\fsevents\node_modules\inherits' -> 'E:\WebSite\PHP\w
ww\iconfont\fonteditor-master\node_modules\fsevents\node_modules.inherits.DELETE'
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents\node_modules\ini):
npm WARN enoent SKIPPING OPTIONAL DEPENDENCY: ENOENT: no such file or directory, rename 'E:\WebSite
PHP\www\iconfont\fonteditor-master\node_modules\fsevents\node_modules\ini' -> 'E:\WebSite\PHP\www\ic
onfont\fonteditor-master\node_modules\fsevents\node_modules.ini.DELETE'...
...
ERROR in ./src/fonteditor/template/export/icon-css.tpl 5:0
Module parse failed: Unexpected character '@' (5:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to
process this file. See https://webpack.js.org/concepts#loaders
| */
|

@font-face {
| font-family: "{%=fontFamily%}";
| src: url("{%=fontFamily%}.eot"); /* IE9 */
@ ./src/fonteditor/template/export-render.js 43:55-87
@ ./src/fonteditor/widget/exporter.js
@ ./src/fonteditor/index.js
...
ERROR in Template execution failed: ReferenceError: lang is not defined

ERROR in ReferenceError: lang is not defined

index.tpl:100
E:/WebSite/PHP/www/iconfont/fonteditor-master/index.tpl10010

赶时间只好写js脚本自动导出了

 

先在http://fontstore.baidu.com/store#创建项目

起始代码点空，想加入项目成员的，怎么搜都搜不到

然后上传*.ttf文件，编辑字体，会跳到http://fontstore.baidu.com/static/editor/index.html?project=bdfont-1000***

我使用的是谷歌浏览器，配置一下下载不提示：

F12调出开发者工具，console下丢入代码：

var stop=0;
var time=500;
$("#glyf-list .glyf-item").each(function(e,i){
	if(stop==0){
		setTimeout('console.log("Start",'+e+')',time); 
		setTimeout('$("#glyf-list .glyf-item:nth-child('+e+')").click();console.log("选中",'+e+');',time); 
		time=time+500;
		setTimeout('$("#glyf-list-commandmenu > li:nth-child(11)").click();console.log("点击导出",'+e+')',time); 
		time=time+500;
		setTimeout('$("#glyf-download-svg").click();console.log("点击下载SVG",'+e+')',time); 
		time=time+1000;
		setTimeout('$("#model-dialog > div > div > div.modal-header > button > span:nth-child(1)").click();console.log("关闭弹框",'+e+')',time); 
		setTimeout('console.log("End",'+e+')',time); 
		time=time+500;
	}
});

撒泡尿的功夫完成了单个字体的svg导出了。

然后批量选择一起上传到iconfont。cn

再对照原来的字体库，修复一下class名字

现在可以愉快的增加图片然后下载覆盖了。